Тебе нравятся сквирклы? Хотя border-radius используется повсюду, выглядит это немного неестественно в месте, где окружность встречается с прямой линией.

Эту проблему решают сквирклы, которые можно увидеть во многих лаунчерах мобильных приложений, включая список приложений в iOS

Теперь сквирклы наконец приходят в веб! Свойство corner-shape довольно мощное, с его помощью можно задавать кастомные формы для border-radius. Одним из предопределённых значений как раз является squircle.

Самое классное - это в целом обратно совместимо: если браузер не поддерживает это свойство, сквиркл будет отображён как квадрат с дефолтным border-radius. Так что готов начать их использовать? 🧐

Подробнее в блоге на Frontend Masters ➡️ @FrontendPortal | #CSS

В этом посте были ссылки, но мы их удалили по правилам Сетки