Cyber Cyan
Dense data dashboard palette — cyan accent on near-black, with cool teal and warm coral signals.
Colors
26 tokens
primary #00D4FF
onPrimary #0F0F1A
primaryContainer #003F4D
onPrimaryContainer #80EAFF
secondary #48CFCB
onSecondary #0F0F1A
secondaryContainer #1F4E4D
onSecondaryContainer #A4E7E5
tertiary #FF6B6B
onTertiary #0F0F1A
tertiaryContainer #5E1F1F
onTertiaryContainer #FFB5B5
background #0F0F1A
onBackground #EAEAEA
surface #1A1A2E
onSurface #EAEAEA
surfaceVariant #252540
onSurfaceVariant #888888
surfaceContainer #1F1F35
surfaceContainerHigh #2A2A45
surfaceContainerLow #15152A
error #FF6B6B
onError #0F0F1A
outline #333333
outlineVariant #222222
scrim #000000
Typography
15 styles
Default font family: JetBrainsMono
| Name | Font size | Weight | Line height | Letter spacing |
|---|---|---|---|---|
| displayLarge | 57sp | 500 | 64sp | -0.25sp |
| displayMedium | 45sp | 500 | 52sp | - |
| displaySmall | 36sp | 500 | 44sp | - |
| headlineLarge | 32sp | 500 | 40sp | - |
| headlineMedium | 28sp | 500 | 36sp | - |
| headlineSmall | 24sp | 500 | 32sp | - |
| titleLarge | 22sp | 500 | 28sp | - |
| titleMedium | 16sp | 600 | 24sp | 0.15sp |
| titleSmall | 14sp | 600 | 20sp | 0.1sp |
| bodyLarge | 16sp | 400 | 24sp | 0.5sp |
| bodyMedium | 14sp | 400 | 20sp | 0.25sp |
| bodySmall | 12sp | 400 | 16sp | 0.4sp |
| labelLarge | 14sp | 600 | 20sp | 0.5sp |
| labelMedium | 12sp | 600 | 16sp | 0.8sp |
| labelSmall | 11sp | 600 | 16sp | 0.8sp |
Shapes
6 radii
extraSmall: 2dpsmall: 4dpmedium: 8dplarge: 12dpextraLarge: 16dpfull: 9999dp
Spacing
6 tokens
none: 0dpextraSmall: 4dpsmall: 8dpmedium: 12dplarge: 16dpextraLarge: 24dp
Elevation
6 tokens
level0: 0dplevel1: 1dplevel2: 2dplevel3: 4dplevel4: 6dplevel5: 8dp
Other
10 tokens
Border
none: 0dpthin: 1dpmedium: 2dpthick: 3dp
Opacity
full: 1.0high: 0.92medium: 0.65disabled: 0.40overlay: 0.32divider: 0.15
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