Fondations

Border radius

Base : --ui-radius = 0.375rem (6px). Tous les composants Nuxt UI héritent de cette variable, multipliée selon le type de surface.

Rayon de base

--ui-radius: 0.375rem

6px — le rayon atomique du design system.

Mapping par composant

ComposantTokenValeurAperçu
GSButton, GSInput, GSBadge--ui-radius6px
GSCard, GSModalcalc(--ui-radius * 2)12px
GSSpaceContent (carte)—16px
GSAvatarrounded-full9999px
GSDropdownMenu, GSPopoverrounded-lg8px

À faire / À éviter

À faire
  • Respecter le mapping ci-dessus.
  • rounded-full réservé aux avatars / pills.
À éviter
  • Hardcoder border-radius: 10px.
  • rounded-3xl sur de l’UI standard.