Générateur de rayons de la frontière CSS

Composez dans les coins arrondis CSS visuellement — réglez chaque coin indépendamment, changez d'unités et copiez propre bordure-rayon CSS.

How to use Border Radius Generator

1. Faites glisser chaque curseur d'angle (ou tapez une valeur) pour définir le rayon pour Top-Left, Top-Right, Bottom-Right et Bottom-Left.
2. Choisissez une unité — px, % ou em — et en option permettre à Link de déplacer tous les coins ensemble.
3. Allumez le blob elliptique / organique pour ajouter un second rayon vertical par coin pour les formes de blob.
4. Cliquez sur Copier CSS pour saisir la déclaration prêt-à-coller border-radius.

Quel est {nom} ?

FAQ

Quelle est la barre oblique de la syntaxe border-radius ?

La barre oblique sépare les rayons horizontaux des rayons verticaux. border-radius: 50px / 20px donne chaque coin une courbe horizontale de 50px et 20px verticale, produisant un arrondi elliptique. Avec quatre valeurs de chaque côté, vous pouvez créer des formes blob organiques.

Devrais-je utiliser px ou des pourcentages?

Utilisez px pour les coins fixes et prévisibles indépendamment de la taille de l'élément. Utilisez % lorsque vous voulez l'arrondi à l'échelle avec l'élément — par exemple, bordure-rayon: 50% sur un carré fait un cercle parfait.

Cela fonctionne-t-il dans tous les navigateurs?

Oui. border-radius est pris en charge dans chaque navigateur moderne sans préfixe, y compris la syntaxe elliptique slash. Aucun préfixe de fournisseur n'est nécessaire.

Related tools

• Glassmorphism Generator
• CSS Gradient Generator
• Box Shadow Generator
• Color Palette Generator