Как сверстать блок с вырезанным углом?

Question

[Владислав]

Есть следующий блок:


Как его можно сверстать? Без SVG, тк адаптив на него тоже должен быть. Как вырезать этот угол так, чтобы все скругления всех углов были?

Comments

[MagicMight]

Что значит "адаптив на него тоже должен быть"? Как это связано?
Вы можете просто в блоке "круга" вставить картинку, которая уже с белой обводкой по нужному вам контуру, который перекроет задний фон

[Владислав]

MagicMight, звучит как костыль

[Ankhena]

Каждую неделю одно и то же. Что ж не гуглится-то..

clip-path
svg
border и радиальные градиенты
псевдоэлементы
и сочетания этих вариантов
и, наверное, что-то ещё, что я в этот раз забыла написать

Без SVG, тк адаптив на него тоже должен быть.

Как SVG мешает адаптиву вообще загадка.

[Владислав]

Ankhena, тем, что вырезанный угол растягивается при растягивании этой свгшки. И кстати, действительно не гуглится, а то что гуглится - ахинея полная, не относящаяся к делу

[Ankhena]

Владислав,

тем, что вырезанный угол растягивается при растягивании этой свгшки.

Ну кто же вас заставляет её растягивать? ))

И кстати, действительно не гуглится, а то что гуглится - ахинея полная, не относящаяся к делу

Я даже не знаю..
Вот тут уже по крайней мере пяток разных тем
https://qna.habr.com/search?q=скругления
или https://qna.habr.com/search?q=вырез

Как сделать такое внутреннее скругление волной у блока средствами css?
Как сделать такое скругление?
и т.д.

[Александр Васильев]

Где-то состоялся выпуск курса дизайнеров )))
Как сделать «впуклую» границу?
Как сделать обтекание текста / блоков с необычной формой?

[Владислав]

Александр Васильев, Не, я бэкендер) Потому с дизайном дружу на уровне "просто знакомый"

[Александр Васильев]

Владислав, я про тренд круглых углов и дизайнеров. Не про тебя.

[Владислав]

Александр Васильев А, тут да, бывает)

[cssfish]

Владислав, делайте маской и растягиваться углы не будут

Answer 1

[MilaNick]

Без маски может быть так (№1) сверстать