CSS Border Radius Generator

Усі інструменти

Налаштування

Статус
Очікування

Живе прев’ю

Що таке CSS Border Radius Generator?

Цей інструмент допомагає генерувати CSS border-radius для заокруглених кутів.

Він корисний для кнопок, карток, полів вводу, модалок, аватарів і сучасних UI-компонентів.

Як користуватися CSS Border Radius Generator

  1. Налаштуйте значення кутів через інпути або повзунки.
  2. Залиште всі кути зв’язаними або редагуйте кожен окремо.
  3. Скопіюйте згенероване значення border-radius або повне CSS-правило.
  4. Вставте існуюче значення border-radius, щоб розібрати його і відредагувати.

Поради

  • Одне значення зручно для однаково заокруглених кутів.
  • Чотири значення підходять для більш нестандартних форм.
  • Заокруглення добре поєднується з box-shadow і gradient.
  • Великі значення border-radius підходять для pill і capsule кнопок.

Пов’язані інструменти

Можливо, тобі також стануть у пригоді ці інструменти.

Питання про CSS Border Radius

Чи можна редагувати всі чотири кути окремо?
Так. Вимкніть зв’язування кутів і задайте кожен кут окремо.
Чи вміє цей інструмент розбирати готовий CSS border-radius?
Так. Ви можете вставити значення border-radius або повний CSS-запис.
Чи підтримуються px і відсотки?
Так. Можна використовувати значення на кшталт 16px або 50%.
Чи оновлюється прев’ю в реальному часі?
Так. Прев’ю оновлюється під час зміни значень.