Как сделать эти две фигуры?

Question

[Vladislav]

Как сделать эти две фигуры без использования clip-path и background-image

Comments

[Одиночка Айс]

Синий квадрат и 2 белых прямоугольника на псевдоэлементах

[Vladislav]

Одиночка Айс, не вариант, на адаптиве ломается ширина прямоугольников

[Стефан]

Vladislav, svg элементом вставьте и все

[Одиночка Айс]

Vladislav, а вы и рыбку съесть хотите и ничего не делать?

[Vladislav]

Одиночка Айс, а эта реплика была лишний, оставили свое мнение при себе, раз отвечаете на вопрос, а то и ответ напишите и наедете

[Lynn «Кофеман»]

Нафига?

[Ankhena]

Как сделать эти две фигуры без использования clip-path и background-image

Какие аргументы у этого запрета?

не вариант, на адаптиве ломается ширина прямоугольников

Хорошо бы тогда показать как именно ломается и что должно происходить при адаптиве.

Answer 1

[Zold09]

4 divs, transformation: и background-color:

Comments

[Vladislav]

данный вариант тоже был испробован, есть еще идеи?

Answer 2

[Максим]

Так вроде бы

Answer 3

[V Sh.]

Можно типа такого, но не уверен, что правильно все уловил: