Alphas
Use these instead of writing rgba() inline. If you need a value that isn't here, add it to the ramp before using it.
Ink — over warm paper
--ink-2 · 0.02
--ink-4 · 0.04
--ink-5 · 0.05
--ink-6 · 0.06
--ink-8 · 0.08
--ink-15 · 0.15
--ink-18 · 0.18
--ink-25 · 0.25
| Token | Value | Role |
|---|---|---|
--ink-2 | 0.02 | row hover |
--ink-4 | 0.04 | nav hover |
--ink-5 | 0.05 | soft edge |
--ink-6 | 0.06 | edge |
--ink-8 | 0.08 | strong edge |
--ink-15 | 0.15 | drop |
--ink-18 | 0.18 | deep drop |
--ink-25 | 0.25 | floor |
Paper — over a bloom
--paper-25 · 0.25
--paper-32 · 0.32
--paper-42 · 0.42
--paper-55 · 0.55
--paper-62 · 0.62
--paper-70 · 0.70
--paper-85 · 0.85
--paper-95 · 0.95
| Token | Value | Role |
|---|---|---|
--paper-25 | 0.25 | caustic |
--paper-32 | 0.32 | glass low |
--paper-42 | 0.42 | bloom-veil |
--paper-55 | 0.55 | code bg |
--paper-62 | 0.62 | glass high |
--paper-70 | 0.70 | chip |
--paper-85 | 0.85 | glass border |
--paper-95 | 0.95 | caustic crown |
Layer alphas to build depth — never reach for a new gray.
Don't use inline alpha math. Every alpha lives as a token; if a value's missing, propose it.