Raggio degli angoli CSS

Con Raggio degli angoli CSS, designer e sviluppatori front-end possono regolare un’interfaccia prima di implementarla. Regola separatamente il raggio di ciascuno dei quattro angoli.

Regola separatamente il raggio di ciascuno dei quattro angoli. Lo strumento è gratuito nel browser e mostra il risultato senza richiedere un account.

Come si usa

Inserisci il valore del raggio per l'angolo superiore sinistro, poi gli altri tre angoli nell'ordine indicato.
Usa un'unità come px, em o percentuale, e mantieni la stessa unità per tutti e quattro gli angoli.
Fai clic sul pulsante genera per produrre la regola CSS border-radius corrispondente.
Leggi il risultato, che combina i quattro valori, e copialo nel tuo foglio di stile.
Verifica la resa su un elemento di esempio prima di aggiungerlo alla tua pagina.

Esempio

L'input di esempio utilizza quattro valori di angolo diversi. Dopo la generazione, il risultato mostra la proprietà border-radius corrispondente. Puoi confrontare questo output con i tuoi valori per confermare l'ordine degli angoli prima di incollarlo nel tuo codice.

Limiti e formati

Lo strumento non disegna un riquadro sullo schermo; produce solo la regola CSS da copiare.
I valori devono essere numerici e zero o positivi; la proprietà CSS non accetta valori negativi.
Mescolare unità può causare l'ignoranza del risultato da parte del browser.
Controlla sempre la resa finale nella tua pagina, perché il contesto dell'elemento può influire sull'effetto visivo.

Dove avviene il trattamento

Tutto viene eseguito nel tuo browser. I valori che inserisci non vengono mai caricati né memorizzati. Il calcolo e la formattazione della regola CSS avvengono localmente, senza comunicazione esterna.

Domande frequenti

In quale ordine devo inserire i quattro valori?

L'ordine previsto è angolo superiore sinistro, superiore destro, inferiore destro, inferiore sinistro. Questo è l'ordine standard della proprietà border-radius. Se inverti due valori, la resa sarà diversa. Controlla il risultato mostrato per confermare.

Posso usare le percentuali?

Sì, le percentuali sono accettate. Creano angoli arrotondati proporzionali alla dimensione dell'elemento. Mantieni la stessa unità per tutti e quattro gli angoli per evitare un risultato incoerente.

Il risultato è pronto per essere incollato nel mio file CSS?

Sì, il risultato è una proprietà CSS completa. Puoi copiarlo e incollarlo nel tuo foglio di stile. Assicurati solo che non venga sovrascritto da un'altra regola.