Générateur de border-radius CSS

À propos de l'outil

Le générateur de border-radius est un outil visuel qui vous permet de concevoir des coins arrondis en CSS avec un aperçu en direct. Contrôle indépendant de chaque coin (haut-gauche, haut-droite, bas-droite, bas-gauche) via des curseurs, avec prise en charge des rayons horizontal/vertical distincts (forme elliptique) grâce à border-radius: 30px 10px / 15px 5px. L'outil génère un CSS propre prêt à coller — idéal pour cartes, boutons, avatars ronds/ovales et conteneurs modernes aux formes organiques.

Questions fréquentes

Différence entre border-radius simple et complexe ?

border-radius: 20px applique le même rayon aux 4 coins. 20px 10px 30px 5px définit chaque coin dans l'ordre : haut-gauche, haut-droite, bas-droite, bas-gauche.

Comment faire un cercle parfait ?

Utilisez border-radius: 50% sur un élément carré (même largeur et hauteur).

Que sont les rayons horizontal/vertical (barre /) ?

La syntaxe 20px / 10px signifie rayon horizontal 20px et vertical 10px, produisant des coins elliptiques.

Fonctionne-t-il sur les images ?

Oui. N'importe quelle img accepte border-radius, typiquement 50% pour un avatar rond.

Peut-on utiliser des pourcentages ?

Oui. Le pourcentage est calculé par rapport à la largeur (horizontal) ou hauteur (vertical) de l'élément.