Как сверстать вот такой блок?

Question

[Сергей Романюк]

Взял на просторах инета макет и вот уже второй час мучает вопрос, как сверстать такой хедер?

Answer 1

[Арсений Матыцин]

Смешно ли нет, но SVG.
Все остальное — попытки скрестить слона и одуванчик. И до кучи узнать, что IE или, там, даже рыжелис не может во всякие хитрые трансформации)

Comments

[Flying]

Поддержу Арсений Матыцин, по хорошему здесь clip-path нужен, но у него с поддержкой пока всё не очень хорошо. А SVG решает задачу весьма просто, да и SVG можно встроить прямо в документ.

[Арсений Матыцин]

Естественно. Clip-path позволяет манипулировать с документами непосредственно в его DOM. Но увы и ах.

К слову, автору вопроса я предложил именно встроенный в HTML SVG. Так как есть мнение, что вот это вот [из примера] возможно требуется анимировать на взаимодействии.

[Сергей Романюк]

Спасибо за ответ. Сорян, если тупой вопрос, просто я новенький