Border-radius Oluşturucu

Görsel önizleme ile CSS border-radius oluşturun.

Esquinas (horizontal)

Superior izq.16px
Superior der.16px
Inferior der.16px
Inferior izq.16px
border-radius: 16px;

CSS yuvarlatılmış köşe oluşturucu (border-radius)

CSS border-radius özelliği, herhangi bir HTML elemanının köşelerini yuvarlatmanızı sağlar; hafif yuvarlatılmış köşelerden tam dairesel şekillere kadar. Modern web tasarımında en çok kullanılan özelliklerden biridir ve pratik olarak tüm web siteleri ve uygulamalarda bulunur. Butonlar, kartlar, avatarlar, görseller ve kapsayıcılar, arayüzü yumuşatan ve daha modern ve kullanıcı dostu tasarımlar oluşturan yuvarlatılmış köşelerden yararlanır.

Oluşturucumuz, her köşeyi ayrı ayrı ayarlamanızı veya hepsini birden değiştirmek için birbirine bağlamanızı sağlar. Ayrıca daha karmaşık organik ve asimetrik şekiller oluşturmak için 8 değerli söz dizimini kullanan eliptik border-radius'u (gelişmiş mod) destekler. Eliptik söz dizimi, "/" ile ayrılmış yatay ve dikey yarıçapları tanımlar ve düz yarıçaplarla elde edilmesi mümkün olmayan damla, yaprak ve diğer organik figürler oluşturmanızı sağlar.

Araç; kare, yuvarlatılmış, hap, yaprak, damla ve bilet gibi yaygın önayarları içerir. Bunları başlangıç noktası olarak kullanabilir ve isteğinize göre özelleştirebilirsiniz. Önizleme gerçek zamanlı olarak güncellenir ve CSS kodu otomatik olarak oluşturularak projenize kopyalayıp yapıştırmanız için hazır hale gelir.

Sıkça sorulan sorular

Eliptik border-radius nedir?

Eliptik border-radius, 8 değerli söz dizimini kullanır: ilk 4 değer yatay yarıçapları, son 4 değer dikey yarıçapları tanımlar ve "/" ile ayrılır. Bu, temel border-radius'tan daha karmaşık asimetrik eğrilere sahip köşeler oluşturmanızı sağlar.

Mükemmel bir daire nasıl yapılır?

Mükemmel bir daire oluşturmak için, eşit genişlik ve yüksekliğe sahip bir elemana border-radius: 50% uygulayın. Oluşturucumuzda "Hap" önayarını kullanın (tüm köşelerde 100px) ve elemanın kare olduğundan emin olun.

Tüm tarayıcılarla uyumlu mu?

Evet, border-radius yıllardır Chrome, Firefox, Safari, Edge ve Opera dahil tüm modern tarayıcılarla uyumludur. Herhangi bir güncel tarayıcı için sağlayıcı öneki gerekmez.