Generatore border-radius
Crea border-radius CSS con anteprima visuale.
Esquinas (horizontal)
border-radius: 16px;Generatore di angoli arrotondati CSS (border-radius)
La proprietà CSS border-radius permette di arrotondare gli angoli di qualsiasi elemento HTML, creando da sottili angoli arrotondati a forme circolari complete. È una delle proprietà più utilizzate nel web design moderno, presente praticamente in tutti i siti web e le applicazioni attuali. Pulsanti, card, avatar, immagini e contenitori beneficiano di angoli arrotondati che ammorbidiscono l'interfaccia e creano design più gradevoli e moderni.
Il nostro generatore ti permette di regolare ogni angolo individualmente o collegandoli per modificarli tutti insieme. Supporta anche il border-radius ellittico (modalità avanzata), che utilizza la sintassi a 8 valori per creare forme organiche e asimmetriche più complesse. La sintassi ellittica definisce raggi orizzontali e verticali separati da una barra "/", permettendo di creare forme come gocce, foglie e altre figure organiche impossibili da ottenere con raggi uniformi.
Lo strumento include preset comuni come quadrato, arrotondato, pillola, foglia, goccia e biglietto, che puoi usare come punto di partenza e personalizzare a piacere. L'anteprima si aggiorna in tempo reale e il codice CSS viene generato automaticamente, pronto da copiare e incollare nel tuo progetto.
Domande frequenti
Cos'è il border-radius ellittico?
Il border-radius ellittico usa la sintassi a 8 valori: i primi 4 definiscono i raggi orizzontali e gli ultimi 4 quelli verticali, separati da "/". Questo permette di creare angoli con curve asimmetriche, producendo forme organiche più complesse rispetto al border-radius base.
Come faccio un cerchio perfetto?
Per creare un cerchio perfetto, imposta border-radius: 50% su un elemento con la stessa larghezza e altezza. Nel nostro generatore, usa il preset "Pillola" (100px su tutti gli angoli) e assicurati che il tuo elemento sia quadrato.
È compatibile con tutti i browser?
Sì, border-radius è compatibile con tutti i browser moderni da anni, inclusi Chrome, Firefox, Safari, Edge e Opera. Non sono necessari prefissi vendor per nessun browser attuale.