Gli strumenti per sviluppatori che usi ogni giorno, tutti in un unico posto.

Convertitori, formattatori, hash, validatori e le piccole utility che continui a riaprire restano insieme invece di perdersi tra le schede.

GitHub

/ Strumenti

■

/ Cerca strumento

109 strumenti

/ Generatore di border-radius

Unità

Preset

Collega tutti gli angoli

In alto a sinistra: 12px

In alto a destra: 12px

In basso a sinistra: 12px

In basso a destra: 12px

Colore dell'anteprima

Dimensione dell'anteprima: 150px

Anteprima

Codice CSS

Proprietà dei singoli angoli

Classe Tailwind

/ Strumento selezionato

■

Generatore di border-radius - strumento generatore gratuito

Generatore visuale di border-radius CSS con controllo individuale degli angoli

■ 01

Cos'è la proprietà CSS border-radius?

La proprietà CSS border-radius arrotonda gli angoli del bordo esterno di un elemento. Puoi impostare tutti e quattro gli angoli sullo stesso valore, oppure specificare valori diversi per ciascun angolo per creare forme uniche.

■ 02

Come funziona?

Il border-radius può essere specificato con un numero di valori da 1 a 4. Con 1 valore, tutti gli angoli sono uguali. Con 2 valori, il primo si applica a alto-sinistra/basso-destra e il secondo a alto-destra/basso-sinistra. Con 3 valori: alto-sinistra, alto-…

■ 03

Casi di esempio

Copre tutti gli angoli uguali, forma a pillola e angoli diversi, così puoi confrontare rapidamente input e output comuni.

/ Strumenti correlati

/ Codice

■

Codice sorgente dello strumento selezionato, mostrato qui accanto alla versione live sulla destra.

/ Codice sorgente

TypeScript

typescript

// No external dependencies needed - generates CSS border-radius strings

interface BorderRadius {
  topLeft: number;
  topRight: number;
  bottomRight: number;
  bottomLeft: number;
  unit: 'px' | '%' | 'rem';
}