Preview on Figma
Buy
Foundation
Colors
Dark mode
Elevation
Icons
Material
Shapes
Typography
Components
Menu and actions
Button
Menu
Pull-down button
Toolbar
Selection and input
Checkbox
Stepper
Toggle
Toggle button
Slider
Segmented control
Date picker
Text field
Digt entry
Navigation and search
Tab bar
Search field
Side bar
Presentation
Page control
Alert
Sheet
Toast message
Status
Progress
Rating
Gauge
Content
Chart
Image view
Text view
Thumbnail
Layout and organization
Card
Collection
Disclosure control
Label
List and table
Separator
View menu
Foundation defines the core building blocks of the design system.
Defines the system’s visual palette.
Applies a dark color scheme.
Creates depth using shadows.
Adds glass-like translucent surfaces.
Defines component outlines and corners.
Sets text style and hierarchy.
Represents actions or concepts visually.
