Schaltflächen

Expanding icon pill

Eine runde Symbolschaltfläche, die sich beim Schweben in eine beschriftete Pille ausdehnt und bei Eintreffen einer Akzentfüllung ihre Glyphe gegen ein Wort eintauscht.

Expanding icon pill verwenden

Eine runde Symbolschaltfläche, die sich beim Schweben in eine beschriftete Pille ausdehnt und bei Eintreffen einer Akzentfüllung ihre Glyphe gegen ein Wort eintauscht.

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: label, accent, collapsed, expanded, cast

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Code, Framework-Versionen und Installationsbefehle sind im Arbeitsbereich oben verfügbar.

Verbinde deinen Agenten

Ähnliche Komponenten

2469Arrow to label pillSchaltflächenEin runder Chevron-Knopf, der sich beim Schweben in eine breite beschriftete Pille ausdehnt und die Markierung gegen ein Wort eintauscht, während die flache Füllung zu einer Rampe mit zwei Stopps wird.

2350Expanding chip back buttonSchaltflächenEin heller Pillenknopf, dessen Akzentchip sich beim Schweben über die gesamte Breite erstreckt und seinen Pfeil zur anderen Seite trägt, während das Etikett an Ort und Stelle bleibt und abgedeckt wird.

2523Label swap slide buttonSchaltflächenEine umrandete Pille, die beim Schweben ihren gesamten Inhalt vertauscht: Die ruhende Reihe gleitet nach oben und heraus, während eine zweite Reihe mit eigenem Symbol und eigener Farbe von unten hineingleitet.

1834Layer swap buttonSchaltflächenZwei abgerundete Schichten, die an einer Ecke verankert sind, tauschen Größen beim Schweben aus, wobei die ruhende Füllung zu einem Samen zusammenfällt, während der Samen wächst, um den Knopf zu füllen.

2580Overshoot icon buttonSchaltflächenEine blasse Pille mit einer großen illustrierten Glyphe am linken Ende, die über den Rand hinaus nach außen zieht und beim Schweben oder Fokussieren zurückspringt.

2521Ring halo pill buttonSchaltflächenEine Pillentaste, die um ihren farbigen Kern herum eine klare Lücke lässt, diese Lücke mit einem aufgehellten Akzentring beim Schweben oder auf der Tastatur füllt und sich beim Drücken nach innen drückt.