Komponenten

Jede Komponente live

Eigenständige React-Komponenten für deine Projekte. Jede Vorschau zeigt die echte Komponente: Bewege den Zeiger, klicke und tippe. Melde dich für Quellcode, Eigenschaften, Installation und die Versionen für Vue, Svelte, Astro und HTML an.

36 von 121

Das vollständige Suchverzeichnis wird geladen.

1548Arrow iconSymboleEin Pfeil in voller Länge, der sich entlang seiner eigenen Achse bewegt, mit gepaarten Pfeilen für die beiden Richtungen.

15493D axis iconSymboleDrei Achsen ziehen sich abwechselnd aus einem Ursprung heraus: Höhe, dann Breite, dann die Tiefendiagonale.

1550Bell iconSymboleEine Benachrichtigungsglocke, deren Körper an der Krone schwingt und deren Klöppel einen Schlag nacheilt.

1551Between iconSymboleEin Pfeil und ein Paar Blöcke zeigen an, wo ein neuer Gegenstand landet: Die Blöcke verschieben sich zur Seite oder der Pfeil gleitet hinein.

1552Blocks iconSymboleDrei quadratische Blöcke, die in einem L angeordnet sind und einer nach dem anderen hüpfen, als würden Teile zusammengesteckt.

1553Check iconSymboleEin Häkchen, das sich vom kurzen Arm zum langen Arm zieht und dann zur Ruhe kommt.

1554Chevron iconSymboleEin nackter Chevron, der sich in die Richtung neigt, in die er zeigt, und sich in beide Richtungen verdoppelt.

1555Clipboard iconSymboleEin Brett, dessen Federklammer gegen die Oberkante springt, mit einer leeren, karierten oder linierten Oberfläche.

1556Compass iconSymboleEin Zifferblatt mit einer Drachennadel, die nach Norden schwenkt und wieder auf dem Drehpunkt in der Mitte sitzt.

1557Copy iconSymboleZwei gestapelte Blätter, bei denen das vordere vom dahinter liegenden Blatt wegrutscht, als würde man ein Duplikat abziehen.

1558Corner arrow iconSymboleEin Pfeil, der durch die offene Ecke eines abgerundeten Quadrats in Richtung der von ihm benannten Ecke gleitet.

1559Crop iconSymboleZwei Ernteschienen, die voneinander gleiten und das Rechteck öffnen, das sie dazwischen ausschneiden.

1560Download iconSymboleEin Pfeil, der für Speicher- und Exportaktionen in ein Fach oder aus einer Wolke gleitet.

1561Ellipsis iconSymboleDrei Punkte, die nacheinander blinken und quer oder unten angeordnet sind, um ein Überlaufmenü zu bilden.

1585Accessibility iconSymboleEine stehende Figur mit offenen Armen und breiter Haltung, die mit langsamem Puls atmet.

1586Airplay iconSymboleEin Display mit einer Lücke am unteren Rand und einem Dreieck darunter, das nach unten und hinten gleitet und das Bild ausstrahlt.

1587Audio lines iconSymboleFünf aufrecht stehende Stangen unterschiedlicher Höhe, die sich nacheinander anheben und wie eine von links nach rechts verlaufende Wellenform wirken.

1588Badge check iconSymboleEine Wellenrobbe, die ihre acht Lappen einzieht und einen Schlag später ein Karo über die Mitte streicht.

1589Cast iconSymboleIn der unteren linken Ecke bleibt ein Bildschirm offen, auf den ein Punkt und zwei Bögen ein Signal lenken.

1590Clapperboard iconSymboleEine Schiefertafel mit einem gestreiften Klöppelstab, der an der oberen linken Ecke angelenkt ist, einrastet und wieder aufschwingt.

1591Cog iconSymboleEin feines Zahnrad mit einer Sechskantbohrung, beide drehen sich zusammen, sodass das Maschinenteil wie ein Stück aussieht.

1592Cross iconSymboleEin aufrechtes Kreuz mit hoher Querlatte und sanft gerundeten Armen, sanft anschwellend in langsamem Puls.

1593Disc iconSymboleEine Schallplatte mit ruhendem Rand und Nabe, während sich drei Rillen um die Spindel drehen, sodass sich tatsächlich die Drehung ergibt.

1612Activity iconSymboleEine Vitalzeichenkurve, die sich von links nach rechts über eine flache Linie zieht, einmal spitzt und dann wieder abflacht.

1613Alarm clock iconSymboleEin Wecker mit zwei Glocken, der auf seinen Füßen klingelt, während die Zeiger einen halben Schlag hinter dem Gehäuse zurückbleiben.

1614Battery iconSymboleEine Zelle mit einem Endknoten, dessen Balken nacheinander blinken; Die Ladeanzeige tauscht die Balken gegen einen Bolzen aus.

1615Clock iconSymboleEin rundes Gesicht, dessen Zeiger über das Zifferblatt streichen; Die Variante wählt aus, zu welcher Stunde das Paar eingefroren ist.

1980Icon crossfade switchEingabefelderEin Kippschalter, dessen Daumensymbol ausgeblendet und in ein anderes Symbol skaliert wird, wenn der Schalter zwischen Aus und Ein wechselt.

Bookmark save chip

2115Bookmark save chipSchaltflächenEin kompakter Speicherchip, dessen Lesezeichenmarkierung von der Umrisslinie zur gefüllten Position springt und einen kleinen Zug nach unten ausführt, sobald ein Element gespeichert wird.

2157Four edge wipe icon buttonSchaltflächenEine quadratische Symbolschaltfläche, deren Glyphe kleiner wird, während vier geneigte Felder von jeder Kante nach innen gleiten und die Kachel mit einer Akzentfarbe überfluten.

Decline call circle

2490Decline call circleSchaltflächenEine runde, nur aus Symbolen bestehende Ablehnungstaste, deren Mobilteil-Glyphe sich beim Drücken in eine aufgehängte Pose neigt, mit einem kleinen Ablehnungsschütteln beim Schweben.

Expanding disc mute toggle

2520Expanding disc mute toggleSchaltflächenEin rundes Symbol zum Umschalten, bei dem eine dunkle Scheibe von der Mitte aus wächst, das pastellfarbene Gesicht verschluckt und die Glyphe auf dem Weg darunter ins Helle verwandelt.

Growing back arrow

2576Growing back arrowSchaltflächenEine bloße Linkspfeil-Rückensteuerung, die beim Schweben wächst und ihren Schaft ausdehnt und dann beim Drücken in den Ruhezustand einrastet.

Grounded download pill

2608Grounded download pillSchaltflächenEin vollständig abgerundeter Download-Button mit einem akzentfarbenen Schatten, der beim Drücken enger wird, während sein Pfeil nach unten zeigt und zurückspringt.

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

Glide swap button

2715Glide swap buttonSchaltflächenEine Schaltfläche mit fester Breite, deren Beschriftung vom rechten Rand abrutscht, während die Glyphe in die Mitte gleitet. Alles sitzt auf einer harten farbigen Leiste, auf die die Schaltfläche beim Drücken fällt.

Gesamtes Verzeichnis öffnen

Schlagwörter

3d (16)accessible (4)accordion (9)action (3)actions (6)activity (5)add (7)alert (8)align (3)ambient (39)analytics (13)anchored (3)animated (82)animation (4)annotation (3)app shell (3)arc (4)arcs (3)area (12)area chart (4)arrow (32)audio (3)aurora (4)auth (11)authentication (12)auto height (4)autocomplete (4)avatar (10)avatars (3)axis (5)backdrop (18)backer (3)background (54)badge (21)band (6)banner (9)bar (16)bar chart (3)bars (6)beam (6)beams (5)bevel (12)bezel (3)bin (3)blend (4)blob (4)blobs (3)bloom (10)blur (15)booking (9)bookmark (3)border (16)bounce (6)brackets (3)breadcrumb (4)breathing (3)broadcast (3)burst (7)busy (5)button (397)button group (5)buttons (4)calendar (32)call to action (11)callout (3)canvas (89)capsule (12)caption (8)card (35)cards (7)caret (5)carousel (11)cascade (3)category (3)cells (4)chain (3)characters (4)chart (59)chat (4)check (3)checkbox (13)checklist (6)checkmark (5)chevron (10)chip (22)chips (4)circle (9)circular (5)click (7)clip (9)clipboard (3)close (4)cloud (3)cluster (3)code (6)collapse (11)collapsible (6)collision (3)column (3)columns (3)combobox (4)command palette (3)compact (8)comparison (8)composer (4)concentric (4)confetti (4)confirm (24)confirmation (7)console (5)contact (3)context menu (4)copy (4)corner (6)corners (7)count (7)count-up (3)counter (18)crossfade (5)crosshair (6)cta (28)cue (4)cursor (26)curtain (7)curve (4)cycle (6)dark (15)dark mode (4)dashboard (9)dashed (5)date picker (16)date range (13)deck (3)delay (5)delete (8)depth (32)destructive (9)destructive-action (4)device mockup (3)diagonal (13)diagram (3)dial (5)dialog (17)digits (5)direction (5)disc (5)disclosure (8)dismiss (6)displacement (3)distortion (5)divider (4)dock (4)donut (7)dots (15)download (10)drag (21)draw (3)drawer (10)drift (17)dropdown (18)dropdown menu (3)duration (3)easing (4)echo (3)edge (7)edge light (3)editor (3)elastic (8)elevation (6)ellipsis (3)email (3)emboss (4)emphasis (3)empty state (3)entrance (14)error state (3)events (3)exit (3)expand (23)explorer (3)fade (9)falling (3)falloff (4)fan (6)faq (4)feed (3)feedback (12)field (6)fill (46)film (3)filter (12)flat (6)flat shadow (3)flight (3)flip (10)floating panel (4)flood (14)flow (5)fluid (3)flyout (3)focus (19)focus ring (5)focus trap (6)folder (5)follow (11)form (47)form-control (12)formatting (3)frame (19)gallery (15)game (3)gap (4)gauge (5)gesture (6)ghost (7)glare (3)glitch (9)glow (39)glyph (7)gradient (38)grain (10)gravity (3)grid (35)group (8)guide (3)hairline (8)halftone (4)halo (15)hamburger (4)hard shadow (6)heading (8)headline (19)hero (11)hexagon (3)highlight (22)hinge (4)hint (12)hold (6)horizon (3)horizontal (4)hover (251)hover card (10)hover reveal (3)icon (121)icon-button (23)icons (4)identity (3)indeterminate (4)indicator (9)inertia (4)initials (3)ink (4)inline (5)input (20)input group (3)inset (11)interactive (8)invert (26)italic (3)key (11)keyboard (20)keyboard navigation (6)keycap (10)knob (4)kpi (5)label (14)label reveal (3)label swap (9)labels (7)lag (4)lattice (4)launch (3)layered (9)layers (3)layout (18)ledge (6)legend (9)lens (4)letters (10)lift (19)light (22)lightbox (4)like (4)line (11)line chart (4)lines (8)link (11)link preview (7)liquid (7)list (13)live (3)loader (9)loading (27)login (10)loop (42)magnet (5)magnetic (3)magnify (3)map (4)marker (3)markers (6)marquee (8)mask (9)matrix (4)media (4)menu (23)merge (3)mesh (5)message (4)metal (10)meter (5)metric (10)metrics (5)minimal (10)modal (19)monospace (12)monthly (12)morph (14)motion (3)motion tuning (3)moulded (6)multi-select (4)nav (3)navbar (3)navigation (21)nested (7)neutral (4)night (4)noise (16)notification (3)notifications (4)nudge (4)number (11)odometer (5)offset (7)on-off (4)onboarding (3)one time code (5)options (5)orb (4)orbit (13)otp (3)outline (63)outlined (4)overflow (7)overlay (24)overshoot (3)page (18)palette (3)panel (31)panels (6)paper plane (4)paragraph (3)parallax (15)particles (18)paste (3)path (4)pattern (9)percentage (4)perimeter (3)perspective (20)photo (5)physics (5)picker (3)pie (7)pill (83)pill switch (4)pin (3)pinned (3)pixel (3)placeholder (4)plane (5)plate (9)play (4)playful (7)pointer (65)polar (8)pop (4)popover (17)post card (3)power (3)press (77)pressed (6)pricing (3)primitive (4)print (4)profile (8)progress (27)proportion (4)providers (4)pulse (17)queue (3)quiet (5)radar (9)radial (8)radio (4)radio group (8)raised (3)ramp (5)ranking (3)rays (4)readout (4)record (3)registration (3)relay (3)relief (6)remove (3)reorder (3)resize (4)restore (3)retro (4)reveal (80)ribbon (6)rim (8)ring (25)rings (10)ripple (18)rise (3)roll (6)rotate (21)rotating text (4)rotation (6)round (5)rounded (3)row (11)rows (4)save (5)scale (20)scan (5)scatter (4)scheduler (3)scramble (5)screen (3)screenshot frame (3)scroll (38)scrub (5)search (8)section (4)sections (4)segmented (7)segmented control (12)select (5)selection (5)send (23)sequence (8)series (7)settings (11)shadow (28)shape (3)share (25)shared element (4)sheen (14)sheet (4)shell (3)shimmer (8)shine (5)shortcut (4)shuffle (3)shutter (5)sidebar (7)sign in (11)signal (8)signup (9)silhouette (3)sizes (4)skew (9)slab (6)slide (20)slider (10)sliding highlight (7)sliding indicator (3)snap (4)social (6)soft (6)space (5)spark (3)sparkline (3)spin (15)spinner (9)split (9)split-flap (3)split text (3)spotlight (7)spring (63)square (5)squash (4)stack (17)stacked (7)stagger (40)staircase (3)star (3)stars (6)stat (5)state (11)static (3)status (21)stepper (3)steps (3)sticker (4)sticky (4)streaks (3)strikethrough (3)stripes (5)stroke (6)submenu (9)submit (7)subtle (3)success (3)surface (5)svg (102)swap (12)sweep (40)swell (4)swipe (5)swirl (3)switch (16)tabs (22)tactile (26)tap (4)target (3)task (3)team (5)terminal (3)text (40)text button (3)text-effect (3)text field (4)text transition (3)textarea (4)texture (11)theme (3)theme toggle (4)thumbnail (4)ticker (5)tile (16)tiles (12)tilt (26)time (3)time range (3)time series (3)timeline (3)timer (3)timing (5)tint (5)toggle (65)toggle group (10)toolbar (25)tooltip (37)total (3)touch (3)trace (4)tracking (6)trail (20)transition (6)translucent (9)travel (6)tray (3)tree (3)trend (10)trigger (4)tunnel (4)twinkle (4)typewriter (9)typing (8)typography (18)underline (10)upload (5)uppercase (14)validation (5)value (3)values (4)variants (4)velocity (3)verification (8)video (4)viewport (6)voice (3)warp (6)wash (5)wave (13)waveform (3)waves (7)window (3)wipe (23)wireframe (3)wireless (3)wobble (6)word swap (3)words (3)wrapper (3)zoom (4)