Как сделать эффект закруглений как на фото?

Question

[Андрей]

Как можно сделать закругления как на фото?


Подозреваю, что просто на CSS это не сделаешь, поэтому возможно есть уже готовый скрипт?
Получилось вот так только:

Comments

[Ankhena]

Знает кто как можно сделать закругления как на фото?

Раньше реже, а сейчас это еженедельный вопрос.

https://jsfiddle.net/Ankhena/xjpefyq0/
https://codepen.io/AnnaSummer/pen/gOQVxBR
https://jsfiddle.net/Ankhena/wkdfngyu/
https://jsfiddle.net/Ankhena/1hu9ot0q/1/

и т.д.

[Андрей]

Ankhena, Спасибо. Это сейчас популярный стиль.

[Максим]

Ankhena, то есть получается такие скругления делать в ручную?автоматизировать не получиться?

[Ankhena]

Максим, автоматизировать? Я все стили пишу руками. Вы имеете в виду придумать миксин? Это получится.

[Максим]

Ankhena, я имел ввиду, расположили сетку с картинок то типу масонри, их много и везде вот такие/подобные скругления и не получится автоматизировать такие радиусы? Или для каждого изображения делать в ручную ?

[Ankhena]

Максим, если есть закономерность, то получится. Тут она есть,по крайней мере по предоставленному скрину.
И обычный грид, без masonry.

Answer 1

[Kamomiruku]

img {
  border-radius: 15px;
}

Это также работает с картинкой, у которой нет бордера

Comments

[Deita]

Та CSS косячный, проще общую картинку разрезать если нет никакой анимации

Answer 2

[dvrr]

border-radius