Boutons

Expanding icon pill

Un bouton d'icône rond qui s'étire en une pilule étiquetée au survol, échangeant son glyphe contre un mot à mesure qu'un remplissage d'accent arrive.

Utiliser Expanding icon pill

Un bouton d'icône rond qui s'étire en une pilule étiquetée au survol, échangeant son glyphe contre un mot à mesure qu'un remplissage d'accent arrive.

Testez l’aperçu avec la souris et le clavier, puis vérifiez la visibilité du focus et la mise en page sur un écran étroit. Indiquez le numéro ou l’identifiant du composant à votre agent de programmation.

Propriétés: label, accent, collapsed, expanded, cast

Quels frameworks sont disponibles ?

Le catalogue propose ces versions : react, vue, svelte, astro, html. L’aperçu de cette page utilise React.

Comment accéder à l’implémentation ?

Le code, les versions et les commandes d’installation sont disponibles dans le panneau ci-dessus.

Connectez votre agent

Composants proches

2469Arrow to label pillBoutonsUn bouton à chevron rond qui s'étend en une large pilule étiquetée en survol, échangeant la marque contre un mot tandis que le remplissage à plat devient une rampe à deux arrêts.

2350Expanding chip back buttonBoutonsUn bouton de pilule pâle dont la puce d'accent s'étend sur toute la largeur en survol, portant sa flèche vers l'autre côté tandis que l'étiquette reste en place et est recouverte.

2523Label swap slide buttonBoutonsUne pilule bordée qui échange tout son contenu en survol : la rangée de repos glisse vers le haut et vers l'extérieur tandis qu'une deuxième rangée avec sa propre icône et sa propre couleur glisse par le bas.

1834Layer swap buttonBoutonsDeux couches arrondies ancrées dans un coin échangent des tailles en survol, le remplissage restant s'effondrant en une graine tandis que la graine grandit pour remplir le bouton.

2580Overshoot icon buttonBoutonsUne pilule pâle avec un grand glyphe illustré garé à son extrémité gauche qui tire vers l'extérieur au-delà du bord et revient en vol stationnaire ou en mise au point.

2521Ring halo pill buttonBoutonsUn bouton de pilule qui maintient un espace clair autour de son noyau coloré, remplit cet espace avec un anneau d'accent allégé lors du survol ou de la mise au point du clavier, et se serre vers l'intérieur lorsqu'il est enfoncé.