Skip to content
mtrl
.
/
Components
Components
Styles
Examples
Documentation
GitHub ↗
⌘
K
Components
Styles
Documentation
GitHub ↗
Components
Overview
Actions
Button
Icon button
Button group
Split button
FAB
Extended FAB
Selection & input
Checkbox
Switch
Radio buttons
Chips
Slider
Text field
Select
Search
Date picker
Time picker
Navigation
Navigation rail
Drawer
Tabs
Menu
Top app bar
Bottom app bar
Containment
Card
List
Carousel
Divider
Dialog
Bottom sheet
Side sheet
Communication
Badge
Progress
Loading indicator
Snackbar
Tooltip
mtrl · Material Design 3
MIT license
Icons:
Material Symbols
by Google,
Apache 2.0
Type:
Roboto
by Google,
OFL 1.1
Vanilla
Web Components
React
Vue
Svelte
SolidJS
ACTIONS / SPLIT BUTTON
Documentation ↗
Split button
A primary action and more possibilities. Open the trailing menu to try the alternatives.
Live preview
View code
Theme
Baseline
Neutral
Vibrant
Expressive
Fidelity
Content
Monochrome
Rainbow
Fruit salad
Ocean
Forest
Spring
Sunset
Autumn
Desert
Summer
Brownbeige
Sageivory
Tealcaramel
Highcontrast
Light
Dark
Copy code
CONFIGURATION
Reset
Appearance
Variant
filled
tonal
outlined
elevated
Size
XS
S
M
L
XL
Content
Icon
None
Text
Menu label
Menu options
save
share
Behavior
Disabled
Esc
mtrl