Générateur de rayon de bordure CSS
Coins ronds exactement comme vous voulez — des cartes subtiles aux blobs ludiques.
- Vos données ne quittent jamais votre appareil
- 100 % gratuit
- Sans inscription
- Fonctionne hors ligne après la première charge
Comment définir un rayon de bordure CSS
- Définissez les coins — ensemble ou un par un.
- Ou passez en mode blob et faites glisser les poignées.
- Copiez la classe CSS ou Tailwind.
À propos : Générateur de border-radius
Créez des valeurs CSS border-radius visuellement.
Tout fonctionne dans votre navigateur, il est donc instantané et privé. Vos couleurs et paramètres récents sont mémorisés sur cet appareil, et la barre d'adresse conserve votre couleur afin que vous puissiez la partager ou la mettre en signet.
Idéal pour
- Cartes, boutons et avatars
- Fond de blob organique
- Bulles, onglets et feuilles
Conseil : Pourcentages à l'échelle avec l'élément ; px conserve la même courbe à n'importe quelle taille.
Questions fréquentes
Comment puis-je faire une forme blob?
Basculez sur “Fancy blob shape”, faites glisser les 4 poignées le long des bords (ou utilisez les curseurs), ou appuyez sur Random blob. / rayons verticaux.
Comment puis-je faire un cercle ou une pilule?
Un cercle est border-radius: 50% sur un élément carré; une pilule est un très grand rayon (comme 999px) sur un élément large. Les deux sont des presets.
Que signifient les 4 valeurs ?
Ils vont dans le sens des aiguilles d'une montre depuis le coin supérieur gauche : haut gauche, haut droit, bas droit, bas gauche.
Quelle unité devrais-je utiliser?
Pixels pour les coins fixes, % à l'échelle avec l'élément (50% transforme un carré en cercle), ou rem pour suivre la taille de la police.
Pourquoi les coins de mon image ne sont-ils pas arrondis ?
Mettez le rayon sur l'image elle-même, ou sur son conteneur avec débordement: caché, de sorte que l'image est coupée aux coins arrondis.