Skip to content

Components

129 parts of a screen, such as buttons, input fields, overlays and charts, grouped by use. Open a card to see a working demo and the source.

Buttons and actions 13
Inputs and selection 30
Date and time 5
Overlays 9
Menus and navigation 16
Display and feedback 19
Lists and tables 13
Charts 11
Motion text 6
Effects and motion 2
Other 5

Buttons and actions

13

ComponentBase
Button
The base button with press feedback, sound and several variants.
ComponentBase
Button link
An anchor that looks like the Button, for navigation that has to stay a real link.
ComponentBase
Reaction toggle
Like and dislike pills whose count changes in place.
ComponentBase
Action button
A button that moves through pending and success states and reports the result of an action.
ComponentBase
Button group
A row of related buttons with an optional overflow menu.
ComponentBase
Split button
A button with a primary action and an attached menu of related actions.
ComponentBase
Confirm morph
A button that morphs in place through confirm, pending and done steps, with undo.
ComponentBase
Hold to confirm
A button that only fires after being held down, with a fill progress.
ComponentBase
Copy button
A button that copies a value to the clipboard and confirms it.
ComponentBase
Expanding button group
A group of icon buttons where the active one expands to show its label.
ComponentBase
Floating button group
A floating toolbar of action buttons with tooltips and optional shortcuts.
ComponentBase
Theme switch
A button that toggles light and dark themes with a rotating icon swap.
ElementBase
Ripple Button
A micro-interaction button with a ripple spreading from the press point

Inputs and selection

30

Date and time

5

Overlays

9

Display and feedback

19

Lists and tables

13

Charts

11

Motion text

6

Effects and motion

2

Other

5