Как верстаются подобные векторные изображения?

Question

[Mikhail]

Здравствуйте! Нашёл интересный макет, но с первых же секунд ступор - как такое сверстать?

Потыкался сам, находил что-то похожее на форумах, но всё равно решил задать вопрос...
Вот всё, что я сделал в песочнице: https://codepen.io/mikhail-khanaev/pen/yLbqZoa

Если поможете, то буду очень благодарен) Заранее большое спасибо

Comments

[Sergo Zar]

Ну я бы с помощью svg либо canvas делал бы

[Ankhena]

background-image и вперёд

[Сергей]

Например, это прозрачный фон. Вы делаете изображение, часть которого прозрачна.
Хитрая комбинация таких фонов - и вы получите результат.
Другой способ - Канвас.

[Anonimmus]

Мда уж. Вечная борьба дизайнера и верстальщика)

Answer 1

[freeman0204]

Я так понимаю это фигма. Сохраните именно видимую часть в svg и вставьте через before как фон, и добавьте pointer-events: none;

Answer 2

[profesor08]

Никак. Векторные изображения, остаются векторными изображениями.