6XC

Générateur de border-radius CSS

Arrondissez chaque coin individuellement ou tous à la fois, en px ou %, avec aperçu en direct et CSS copiable.

968 vues

Unité

La propriété border-radius

L'ordre abrégé est border-radius: haut-gauche haut-droite bas-droite bas-gauche. Les pixels donnent un arrondi fixe ; les pourcentages s'adaptent à la taille de la boîte — 50% sur un carré donne un cercle parfait. Des valeurs inégales créent des formes organiques en « blob », populaires dans les sections hero modernes.

Questions fréquentes

Comment créer un cercle ou une pilule ?

Un élément carré avec border-radius: 50% devient un cercle. Un rectangle avec un grand rayon fixe (par exemple 999px) devient une pilule.

px ou % — lequel utiliser ?

Utilisez px lorsque les coins doivent paraître identiques à toutes les tailles (cartes, boutons). Utilisez % lorsque l'arrondi doit s'adapter à l'élément, comme pour les cercles et les blobs.

Outils similaires

Générateur de dégradé CSS Concevez des dégradés CSS linéaires, radiaux et coniques avec aperçu en direct et copiez le code. Lancer Générateur d'ombre CSS (box-shadow) Concevez une box-shadow visuellement — décalages, flou, étalement, couleur, opacité et inset — avec aperçu en direct. Lancer Générateur d'ombre de texte CSS Concevez un text-shadow avec décalages, flou, couleur et opacité — aperçu en direct sur un texte d'exemple. Lancer Générateur CSS de glassmorphism Concevez un effet de verre (glassmorphism) avec aperçu en direct — ajustez le flou, la transparence, la teinte et la bordure, puis copiez le CSS. Lancer