Sunset
Warm orange palette with golden accents — for the magic hour.
Colors
26 tokens
primary #FFFFFF
onPrimary #FF5722
primaryContainer #FFE0B2
onPrimaryContainer #5D1A00
secondary #FFD700
onSecondary #5D1A00
secondaryContainer #FFEC8B
onSecondaryContainer #5C4400
tertiary #FFAB91
onTertiary #5D1A00
tertiaryContainer #FFCCBC
onTertiaryContainer #3E1100
background #FF5722
onBackground #FFFFFF
surface #D84315
onSurface #FFFFFF
surfaceVariant #BF360C
onSurfaceVariant #FFE0B2
surfaceContainer #E64A19
surfaceContainerHigh #F4511E
surfaceContainerLow #BF360C
error #B00020
onError #FFFFFF
outline #FFAB91
outlineVariant #BF360C
scrim #000000
Typography
15 styles
Default font family: Nunito
| Name | Font size | Weight | Line height | Letter spacing |
|---|---|---|---|---|
| displayLarge | 57sp | 400 | 64sp | -0.25sp |
| displayMedium | 45sp | 400 | 52sp | - |
| displaySmall | 36sp | 400 | 44sp | - |
| headlineLarge | 32sp | 400 | 40sp | - |
| headlineMedium | 28sp | 400 | 36sp | - |
| headlineSmall | 24sp | 400 | 32sp | - |
| titleLarge | 22sp | 400 | 28sp | - |
| titleMedium | 16sp | 500 | 24sp | 0.15sp |
| titleSmall | 14sp | 500 | 20sp | 0.1sp |
| bodyLarge | 16sp | 400 | 24sp | 0.5sp |
| bodyMedium | 14sp | 400 | 20sp | 0.25sp |
| bodySmall | 12sp | 400 | 16sp | 0.4sp |
| labelLarge | 14sp | 500 | 20sp | 0.1sp |
| labelMedium | 12sp | 500 | 16sp | 0.5sp |
| labelSmall | 11sp | 500 | 16sp | 0.5sp |
Shapes
6 radii
extraSmall: 4dpsmall: 8dpmedium: 12dplarge: 16dpextraLarge: 28dpfull: 9999dp
Spacing
6 tokens
none: 0dpextraSmall: 4dpsmall: 8dpmedium: 16dplarge: 24dpextraLarge: 32dp
Elevation
6 tokens
level0: 0dplevel1: 1dplevel2: 3dplevel3: 6dplevel4: 8dplevel5: 12dp
Other
10 tokens
Border
none: 0dpthin: 1dpmedium: 2dpthick: 4dp
Opacity
full: 1.0high: 0.87medium: 0.60disabled: 0.38overlay: 0.50divider: 0.12
In context
Preview the theme on real components
★ Sample app
Surface container low
Outer container, lowest emphasis
Surface container
Surface container high
Highest emphasis content sits here
Featured card
Card uses primaryContainer with onPrimaryContainer text
Primary Secondary Tertiary
Label Field value