Как сверстать такой формы блоки?

Question

[Максим]

Как сверстать такой формы блоки? Нужно чтобы была тень и желательно чтобы были адаптивны

Answer 1

[Сергей Горячев]

SVG

Comments

[Максим]

как тень сделать?

[Сергей Горячев]

Максим: Как реализовать тень для SVG Path?

Answer 2

[Полина Емельянова]

Можно попробовать градиентами обрезать...
Типа

background: linear-gradient(-135deg, transparent 19px, $dark 0) top right;

- срезал верхний правый угол...

Answer 3

[Mary Солнечная]

Polygon
Поддержка браузеров
a потом transform --> Тыц

Comments

[Максим]

плохая поддержка

[Mary Солнечная]

Поэтому я вам и скинула ссылку на caniuse.
Тогда вам надо либо svg, либо верстать обычный div + наложить абсолютом псевдоэлементы-уголки с прозрачностью и трансформацией вертеть ваш блок как вам угодно :)

[Максим]

Mary Солнечная: сделал уже на svg, спасибо