Към съдържанието

CSS Border Radius генератор

Генерирайте CSS border-radius визуално с преглед на живо. Коригирайте всеки ъгъл поотделно или ги свържете. Поддържа px, % и rem. Копирайте CSS кода. Безплатен онлайн инструмент.

Преглед

12px
12px
12px
12px
Единица

CSS изход

 

Какво е CSS border-radius?

CSS свойството border-radius заоблява ъглите на външния ръб на рамката на елемент. Можете да зададете един радиус за кръгови ъгли или два радиуса за елиптични ъгли.

Синтаксис на border-radius

Съкращението border-radius приема от 1 до 4 стойности. С 1 стойност всички ъгли са еднакви. С 2 стойности първата задава горе-ляво/долу-дясно, а втората горе-дясно/долу-ляво. С 4 стойности всеки ъгъл се задава поотделно: горе-ляво, горе-дясно, долу-дясно, долу-ляво.

Елиптични ъгли

С помощта на синтаксиса / (напр. border-radius: 50% / 30%), можете да дефинирате различни хоризонтални и вертикални радиуси за елиптични ъгли.

Поверителност

Цялото генериране на border-radius работи 100% във вашия браузър. Никакви данни не се изпращат на сървър.