Shadows

1dp
2dp
3dp
4dp
6dp
8dp
9dp
12dp
16dp
24dp

Snackbars

Show snackbar

Modals

Show modal

Prompts

Show prompt

Data tables

TypeTextNumber
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
DisabledLorem ipsum dolor sit amet, consectetur adipiscing elit152
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10
EnabledLorem ipsum dolor sit amet, consectetur adipiscing elit10

Form fields

Input
Label
Help text
Regular
Label
Help text
Disabled
Label
Error message
Error
Label
$
Help text
Prefix
Label
/100
Help text
Suffix
Label
Help text
Placeholder
Select
Label
Help text
Regular
Label
Help text
Disabled
Label
Error message
Error
Textarea
Label
Help text
Regular
Label
Help text
Disabled
Label
Error message
Error
Checkbox
Help text
Regular
Help text
Disabled
Error message
Error
Switch
Help text
Regular
Help text
Disabled
Error message
Error
Date picker
Help text
Regular
Help text
Disabled
Help text
Error
Time picker
Label
Help text
Regular
Label
Help text
Disabled
Label
Help text
Error

Form validation

Text
Required

Text
Optional

Text
Min length 8

Text
Max length 8

Text
Min length 8, max length 16

Phone
Phone format

Email
Email format

Numeric
Numeric format

Min 2 days in future

Label
Format HH:MM

Match field 1
Must match the field below.

Match field 2
Must match the field above.

Validate form

Typography

Headline 1

Font
Open Sans
Weight
Light
Size
95px
Letter spacing
-1.5px
Line height
120px

Headline 2

Font
Open Sans
Weight
Light
Size
59px
Letter spacing
-0.5px
Line height
76px

Headline 3

Font
Open Sans
Weight
Regular
Size
48px
Letter spacing
0px
Line height
64px

Headline 4

Font
Open Sans
Weight
Regular
Size
34px
Letter spacing
0.25px
Line height
44px
Headline 5
Font
Open Sans
Weight
Regular
Size
24px
Letter spacing
0px
Line height
32px
Headline 6
Font
Open Sans
Weight
SemiBold
Size
20px
Letter spacing
0.15px
Line height
28px
Subtitle 1
Font
Open Sans
Weight
Regular
Size
16px
Letter spacing
0.15px
Line height
24px
Subtitle 2
Font
Open Sans
Weight
Regular
Size
14px
Letter spacing
0.1px
Line height
20px
Body 1
Font
Open Sans
Weight
Regular
Size
16px
Letter spacing
0.5px
Line height
24px
Body 2
Font
Open Sans
Weight
Regular
Size
14px
Letter spacing
0.5px
Line height
20px
Button
Font
Open Sans
Weight
SemiBold
Size
14px
Letter spacing
0.5px
Line height
20px
Caption
Font
Open Sans
Weight
Regular
Size
12px
Letter spacing
0.4px
Line height
16px
Overline
Font
Open Sans
Weight
Regular
Size
10px
Letter spacing
1.5px
Line height
16px