Générateur de Rayon de Bordure CSS
Créez des valeurs de rayon de bordure personnalisées avec des contrôles visuels. Liez ou dissociez les coins pour un ajustement rapide.
Corner Radius
12px
12px
12px
12px
CSS
border-radius: 12px;
Comment utiliser Générateur de Rayon de Bordure CSS
- 1Ajustez le curseur border-radius pour chaque coin de la boîte d'aperçu.
- 2Liez tous les coins ensemble pour un arrondi uniforme, ou dissociez-les pour un contrôle individuel.
- 3Prévisualisez l'effet border-radius en temps réel.
- 4Copiez le code CSS border-radius généré.
ZenovayAnalytics
Transformez votre trafic en clients.
- Suivi des visiteurs en temps réel
- Vie privée d'abord, sans bandeau cookies
- Installé en deux minutes
Outils connexes
Générateur de gradient CSS
Créez de beaux gradients CSS avec un éditeur visuel. Gradients linéaires, radiaux et coniques.Générateur d'Ombre de Boîte CSS
Concevez des ombres de boîte CSS avec des contrôles visuels. Ajustez le décalage, le flou, l'étalement et la couleur.Zone de jeu CSS Flexbox
Apprenez et générez des mises en page CSS Flexbox visuellement. Ajustez la direction, l'alignement, l'enveloppe et l'écart en temps réel.Générateur de grille CSS
Construisez des mises en page CSS Grid avec un éditeur visuel. Définissez les colonnes, les lignes, les espacements et l'étendue des cellules.Questions fréquemment posées
Comment fonctionne la propriété CSS border-radius ?▾
La propriété border-radius arrondit les coins d'un élément. Vous pouvez définir une valeur unique pour tous les coins ou spécifier chaque coin individuellement : en haut à gauche, en haut à droite, en bas à droite, en bas à gauche.
Peut-on définir des valeurs différentes pour chaque coin ?▾
Oui. Cliquez sur l'icône de lien pour dissocier les coins, puis ajustez chaque coin indépendamment. Cela vous permet de créer des formes asymétriques comme des bulles de dialogue ou des onglets.
Quelles unités border-radius supporte-t-il ?▾
Border-radius supporte toutes les unités de longueur CSS. Cet outil utilise les pixels (px), mais vous pouvez également utiliser les pourcentages (%) — 50% crée un cercle parfait sur un élément carré.
Comment créer un cercle parfait ?▾
Définissez les quatre valeurs de coin à 50% (ou la moitié de la largeur/hauteur de l'élément en pixels). L'élément doit être carré pour obtenir un vrai cercle.
Peut-on utiliser cet outil sur téléphone ?▾
Oui, le générateur de border-radius fonctionne dans tout navigateur mobile moderne. Ajustez les valeurs de coin avec les curseurs et copiez le CSS sur n'importe quel appareil.
Le CSS généré est-il compatible avec tous les navigateurs ?▾
Oui. La propriété border-radius est prise en charge par tous les navigateurs modernes, notamment Chrome, Firefox, Safari et Edge. Aucun préfixe propriétaire n'est nécessaire.
Puis-je utiliser le CSS généré avec Tailwind ?▾
Oui. Tailwind dispose d'utilitaires border-radius intégrés comme rounded-lg et rounded-full. Pour des valeurs personnalisées, utilisez la syntaxe de valeur arbitraire comme rounded-[12px_24px_12px_24px] ou collez le CSS dans une classe personnalisée.