Color
The colors Lime uses, and where each one goes.
Accent
- accent#e4f222
- accent-hover#d6e41a
- accent-active#c4d211
- accent-wash#f5f9c4
- accent-line#7c8700
Surfaces
- page#ffffff
- surface#f6f5f2
- surface-2#efeeea
- surface-3#e6e4df
- raised#ffffff
Text and ink
- fg#0f0f0d
- fg-2#4a4943
- fg-3#6b6a63
- fg-disabled#a6a49b
- ink#0f0f0d
Lines
- line#e6e4df
- line-strong#cfcdc6
- control#85827a
Status colors
- success#1e8e4a
- warn#c27a00
- danger#d93636
- success-tint#e5f5ea
- warn-tint#fff3d6
- danger-tint#fdebeb
Contrast
| Weakest pair, needs 4.5:1 unless marked | Light | Dark |
|---|---|---|
| fg, fg-2, fg-3 on page, surface, surface-2, raised, field | 4.7:1 | 5.3:1 |
| fg, fg-2 on surface-3 | 7.1:1 | 7.6:1 |
| danger-text, success-text, warn-text on page, surface, raised | 5.6:1 | 7.3:1 |
| danger-text on danger-tint | 5.7:1 | 7.6:1 |
| success-text on success-tint | 5.4:1 | 10.1:1 |
| warn-text on warn-tint | 5.8:1 | 10.1:1 |
| on-accent on accent, accent-hover, accent-active | 11.5:1 | 10.2:1 |
| fg on accent-wash | 17.6:1 | 12.6:1 |
| fg-inverse on ink | 19.2:1 | 17.3:1 |
| on-danger on danger | 4.6:1 | 4.9:1 |
| accent-line, control on page, surface, surface-2, raised, field, needs 3:1 | 3.3:1 | 4.3:1 |
Glow
Plus plan
$4 a month.
37 tokens
--glow-accent-from- #dbec1c
--glow-accent-to- #f6ff7c
--glow-accent-edge- rgb(255 255 255 / 0.7)
--glow-accent-bloom- rgb(255 255 255 / 0.28)
--glow-accent-cast- 112 120 20
--glow-accent-light- 1
--glow-accent-from-lit- #e4f42c
--glow-accent-to-lit- #faff9c
--glow-accent-edge-lit- rgb(255 255 255 / 0.9)
--glow-accent-bloom-lit- rgb(255 255 255 / 0.4)
--glow-accent-from-press- #c8d915
--glow-accent-to-press- #e6f24a
--glow-danger-from- #a31f1f
--glow-danger-to- #c42b2b
--glow-danger-edge- rgb(255 255 255 / 0.4)
--glow-danger-bloom- rgb(255 255 255 / 0.16)
--glow-danger-cast- 130 30 30
--glow-danger-light- 0.4
--glow-danger-from-lit- #b02424
--glow-danger-to-lit- #d03333
--glow-danger-edge-lit- rgb(255 255 255 / 0.6)
--glow-danger-bloom-lit- rgb(255 255 255 / 0.24)
--glow-danger-from-press- #8a1818
--glow-danger-to-press- #a82121
--glow-success-from- #136b35
--glow-success-to- #1a8445
--glow-success-edge- rgb(255 255 255 / 0.4)
--glow-success-bloom- rgb(255 255 255 / 0.16)
--glow-success-cast- 20 100 55
--glow-success-light- 0.4
--glow-success-fg- #ffffff
--glow-success-from-lit- #126f39
--glow-success-to-lit- #1a8445
--glow-success-edge-lit- rgb(255 255 255 / 0.6)
--glow-success-bloom-lit- rgb(255 255 255 / 0.24)
--glow-success-from-press- #0f5a2b
--glow-success-to-press- #157038
Status
SettledLow balanceFailed
Dark theme
| Role | Light | Dark |
|---|---|---|
--page | #ffffff | #0e0e0c |
--surface | #f6f5f2 | #1a1a17 |
--fg | #0f0f0d | #f4f3ee |
--accent | #e4f222 | #cad649 |
--accent-wash | #f5f9c4 | #2b2e0c |
--accent-line | #7c8700 | #cad649 |
--ink | #0f0f0d | #f4f3ee |
Tokens
37 tokens
--page- #ffffff
--surface- #f6f5f2
--surface-2- #efeeea
--surface-3- #e6e4df
--raised- #ffffff
--field- #f6f5f2
--scrim- rgb(15 15 13 / 0.5)
--fg- #0f0f0d
--fg-2- #4a4943
--fg-3- #6b6a63
--fg-disabled- #a6a49b
--fg-inverse- #ffffff
--on-accent- #0f0f0d
--glow-accent-fg- #0f0f0d
--line- #e6e4df
--line-strong- #cfcdc6
--control- #85827a
--ink- #0f0f0d
--ink-hover- #2a2a26
--ink-active- #3f3f3a
--accent- #e4f222
--accent-hover- #d6e41a
--accent-active- #c4d211
--accent-wash- #f5f9c4
--accent-line- #7c8700
--ring- var(--accent-line)
--success- #1e8e4a
--success-tint- #e5f5ea
--success-text- #17703a
--warn- #c27a00
--warn-tint- #fff3d6
--warn-text- #8a5200
--danger- #d93636
--danger-hover- #c02c2c
--danger-tint- #fdebeb
--on-danger- #ffffff
--danger-text- #b42323