Как можно реализовать данный коричневый фон?

Question

[Дмитрий]

Хотелось бы узнать как можно сделать такой коричневый фон?)

Comments

[Кирилл Никитин]

Есть много способов, но если с поддержкой старых браузеров проблем нет, то самый простой это clip-path.

[Kvason]

Либо свгшками, либо картинкой, либо градиентом, либо, как уже упомянули, clip-path: polygon()

[Сергей delphinpro]

Кирилл Никитин, Зачем?
Судя по всему – это слайдер. Значит он уже в контейнере с overfow:hidden.
Просто поверх слайдера (или слайда) размещаем абсолютом пустой див с полупрозрачным коричневым фоном и делаем ему трансформацию skew или rotate. Лишнее будет скрыто за overfow:hidden.
Или без трансформаций, как подсказывают выше, для этого дива градиентный фон под нужным углом. Так даже лучше.

Answer 1

[ZLevoyRyko1]

В блоке слайдера если используешь фон города как background-image то просто под него еще один блок положи, и дай ему opacity: .4; и z-index больше чем у блока с городом. А что бы фигуру такую сделать то рекомендую через https://www.cssportal.com/css-clip-path-generator/