Как нарисовать фигуру с помощью css?

Question

[Артем Пономарев]

Подскажите пожалуйста как нарисовать такое с помощью CSS? В голову ничего не приходит.
.

Answer 1

[Алексей Скляров]

первая фигура это просто овал, наложенный на прямоугольник.
белая полоса
серая полоса сtransform:skew()

Comments

[Артем Пономарев]

Алексей Скляров Спасибо. По второй фигуре допер. А первую как сделать? Можете подробнее чуток объяснить?
У меня это получается должен быть переход между блоками

[Алексей Скляров]

Артем Пономарев, создаете просто 100% ширины блок, ему добавляете border-radius:25%; и позиционируете как вам нужно.

[Артем Пономарев]

Алексей Скляров, Мне нужно что бы этот наложенный овал был прозрачным

Answer 2

[Stalker_RED]

https://jsfiddle.net/f4dayfL4/
Вообще посмотрите какие бывают свойства transform.
Если нужны какие-то более сложные формы, то можно использовать svg и clip-path.