#19292F
#71838B
#EEE431
#E9F3F8
#393A3COnyx
#00BD3AKelly Green
#ACB3C1Heather
#E8E8EAIce
Worn Kelly Green & Heather is a neutral-based color palette tagged retro, minimal, gray. Kelly Green is the only saturated color here, so it does all the talking against a neutral base. Neither washed out nor loud, it adapts to most contexts.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Onyx | #393A3C | rgb(57, 58, 60) | hsl(220, 3%, 23%) | oklch(34.8% 0.004 265) | |
| Kelly Green | #00BD3A | rgb(0, 189, 58) | hsl(138, 100%, 37%) | oklch(69.4% 0.214 146) | |
| Heather | #ACB3C1 | rgb(172, 179, 193) | hsl(220, 14%, 72%) | oklch(76.6% 0.021 264) | |
| Ice | #E8E8EA | rgb(232, 232, 234) | hsl(240, 5%, 91%) | oklch(93.2% 0.003 286) |
Why it works and how to use it
The palette holds together thanks to its neutral backbone and a strong light-to-dark ladder (91% down to 23% lightness). A natural fit for websites, presentations and branding.
- Background: Ice (#E8E8EA) is the lightest color, so it belongs on large surfaces.
- Text: Onyx (#393A3C) on #E8E8EA gives 9.3:1, passing WCAG AAA.
- Primary: Kelly Green (#00BD3A) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Heather (#ACB3C1) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Onyx on Ice at 9.3:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Worn Kelly Green & Heather
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#393A3C
#00BD3A
#ACB3C1
#E8E8EA
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#393A3C on #E8E8EA | Aa | 9.3:1 | AAA |
#393A3C on #ACB3C1 | Aa | 5.41:1 | AA |
#393A3C on #00BD3A | Aa | 4.52:1 | AA |
#00BD3A on #E8E8EA | Aa | 2.06:1 | Fail |
#ACB3C1 on #E8E8EA | Aa | 1.72:1 | Fail |
#00BD3A on #ACB3C1 | Aa | 1.2:1 | Fail |
Similar palettes 24 more in this mood
#FBF6FA
#C9B3C6
#00A44D
#1E171D
#283A31
#E623B0
#A5C6B5
#F0FBF5
#1B242E
#D3BF00
#B7CEE9
#F1F7FE
#F9F0F7
#ADD500
#D1B7CC
#291D27
#D8AE4F
#8E9700
#44A041
#008E71
#9AD3FF
#64E1AB
#00CBC3
#008BA3
#008B6D
#6C8B38
#00CFCB
#86D894
#A1CC93
#AAA9C7
#BA955A
#7C7A95
#1F333D
#F749B0
#A1CEE3
#DBE8EE
#AA7000
#009C66
#66A019
#B9A916
#3B684F
#855D7A
#B47798
#88BA9B
#E9E9F5
#FCAF0C
#B8B7D3
#222132
#3C923F
#7E981A
#E2CA49
#00EFB2
#EEF2F1
#BFDAD3
#8059BD
#141B1A
#CAAB80
#B193A4
#A46268
#874A2D
#43B0A2
#A5CD98
#FFE3A2
#FFC59B
#1A2F3C
#B05951
#D59368
#E6E2CA
#45365A
#77648D
#D6BC7E
#F7F6F3
#0B0F0E
#3A4642
#BEF62F
#F3FFE0
#649150
#ACBD62
#CB8419
#F2E9D4
#22484C
#499C75
#E7697C
#FD997E
#657282
#FFAEA9
#FFCDB7
#FFEDC1
#2D4059
#EA5455
#F07B3F
#FFD460