ESC

Controles Border Radius

20px
20px
20px
20px

Apercu en Direct

Sortie CSS

Tout le traitement se fait dans votre navigateur. Aucune donnee n'est envoyee a un serveur.

Exemples d'Utilisation

Cercle Parfait

Creez un element parfaitement rond avec un border radius de 50% sur tous les coins.

Forme Pilule

Concevez un bouton en forme de pilule avec de grandes valeurs de border radius horizontal.

Forme Organique

Creez des formes organiques uniques en definissant des valeurs differentes pour chaque coin.

Fonctionnalites

Apercu Visuel en Direct

Voyez l'effet du border radius se mettre a jour en temps reel lorsque vous ajustez les curseurs

Controle Individuel des Coins

Ajustez chaque coin independamment ou liez-les tous pour un border radius uniforme

Formes Predefinies

Acces rapide aux formes courantes comme cercle, pilule, rectangle arrondi et personnalise

Confidentialite d'abord

Tout fonctionne dans votre navigateur — aucune donnee n'est envoyee a un serveur

Comment Utiliser?

1

Ajuster les Coins

Utilisez les curseurs pour definir le border radius de chaque coin, ou activez le mode liaison pour des valeurs uniformes.

2

Previsualiser la Forme

Regardez la boite de previsualisation se mettre a jour instantanement lorsque vous changez les valeurs du rayon.

3

Copier le CSS

Cliquez sur le bouton Copier CSS pour copier le code border-radius genere dans le presse-papiers.

Questions Frequemment Posees

Appliquez border-radius: 50% sur un element carre (largeur egale a la hauteur). Les quatre coins s'arrondissent uniformement et vous obtenez un cercle parfait.

Les pixels donnent une courbure fixe, tandis que les pourcentages s'adaptent a la taille de l'element. Utilisez 50% sur un carre pour un cercle, ou px pour un arrondi constant sur des elements de tailles differentes.

Non. Tout fonctionne dans votre navigateur en JavaScript. Aucune donnee ne quitte votre machine.

A quoi sert cet outil ?

Ce generateur de border-radius vous permet de concevoir visuellement des coins arrondis pour vos elements CSS. Deplacez les curseurs, observez l'apercu se mettre a jour instantanement et copiez le code CSS genere en un clic. Fini de deviner les valeurs dans votre feuille de styles.

Comment fonctionne border-radius en CSS

La propriete CSS border-radius accepte des valeurs en pixels, pourcentages ou ems pour chaque coin. Vous pouvez definir les quatre coins d'un coup en raccourci (border-radius: 10px) ou les controler individuellement. Les pourcentages sont relatifs aux dimensions de l'element, c'est pourquoi 50% sur un carre produit un cercle.

Formes predefinies et creations sur mesure

Demarrez rapidement avec les presets pour cercles, pilules et rectangles arrondis. Ou laissez libre cours a votre creativite avec des valeurs asymetriques sur chaque coin pour creer des formes organiques tres tendance dans le design d'interface moderne.

Compatible avec tous les navigateurs modernes

La propriete border-radius est prise en charge par Chrome, Firefox, Safari et Edge. La syntaxe raccourcie generee par cet outil est le format le plus compatible, vous pouvez la coller directement dans votre projet sans prefixes vendeur.

Sécurité et Confidentialité

La sécurité de vos données est notre priorité

Traitement Local

Tout le traitement se fait dans votre navigateur

Aucun Transfert de Données

Vos données ne sont pas envoyées à nos serveurs

Aucun Stockage de Données

Aucune donnée n'est stockée ou partagée

Chiffrement SSL

Chiffrement SSL pour une connexion sécurisée

Étape Suivante