Corrosive Green as a scale
Eleven steps from #54d905, built by moving lightness in OKLCh and keeping the hue where it is. Every step is gamut-mapped by giving up chroma, never by clipping channels — clipping is what turns a light blue purple.
| Stop | Hex | OKLCh L | Chroma | On white | On black | APCA on white | ΔE00 from the step above |
|---|---|---|---|---|---|---|---|
| 50 | #e3ffdb | 97.0% | 0.056 ·capped | 1.07:1 | 19.58:1 | 0 | — |
| 100 | #c0ffae | 93.8% | 0.124 ·capped | 1.16:1 | 18.15:1 | 0 | 10.3 |
| 200 | #75f944 | 87.4% | 0.243 | 1.36:1 | 15.39:1 | 17 | 12.3 |
| 300 | #5fe323 | 81.0% | 0.243 | 1.68:1 | 12.51:1 | 29 | 5.0 |
| 400 | #4ecd00 | 74.6% | 0.234 ·capped | 2.10:1 | 10.02:1 | 40 | 5.4 |
| 500 | #44b500 | 68.2% | 0.214 ·capped | 2.66:1 | 7.89:1 | 51 | 6.2 |
| 600 | #3b9f00 | 61.8% | 0.194 ·capped | 3.43:1 | 6.13:1 | 61 | 6.8 |
| 700 | #318900 | 55.4% | 0.174 ·capped | 4.47:1 | 4.69:1 | 71 | 7.6 |
| 800 | #287300 | 49.0% | 0.154 ·capped | 5.91:1 | 3.56:1 | 79 | 7.7 |
| 900 | #144400 | 34.0% | 0.107 ·capped | 11.33:1 | 1.85:1 | 96 | 15.5 |
| 950 | #041700 | 18.0% | 0.056 ·capped | 18.64:1 | 1.13:1 | 105 | 18.2 |
What is true of this ramp
- 10 of the 10 adjacent pairs differ by ΔE00 2 or more. Every step here is a step a reader can see.
- The tightest pair is 200 to300, at ΔE00 5.0.
- 9 steps had to give up chroma to stay inside sRGB — 50, 100, 400, 500, 600, 700, 800, 900, 950. A wider display would show them more vividly.
- 3 steps clear 4.5:1 on white (800, 900, 950), and 8 on black (50, 100, 200, 300, 400, 500, 600, 700).
Harmonies from Corrosive Green
complement
the hue directly opposite, at the same lightness. #e78fff (+180°) — chroma capped by sRGB.
analogous
the two neighbours 30° either side. #c1bf00 (+-30°), #00d7a5 (+30°) — chroma capped by sRGB.
split complement
the two hues either side of the opposite, 30° apart from it. #b5abff (+150°), #ff8bc8 (+210°) — chroma capped by sRGB.
triad
the circle divided in three. #8bb9ff (+120°), #ff9497 (+240°) — chroma capped by sRGB.
tetrad
the circle divided in four. #31c8ff (+90°), #e78fff (+180°), #ff9a62 (+270°) — chroma capped by sRGB.
The ramp as CSS
:root {
--corrosive-green-50: #e3ffdb;
--corrosive-green-100: #c0ffae;
--corrosive-green-200: #75f944;
--corrosive-green-300: #5fe323;
--corrosive-green-400: #4ecd00;
--corrosive-green-500: #44b500;
--corrosive-green-600: #3b9f00;
--corrosive-green-700: #318900;
--corrosive-green-800: #287300;
--corrosive-green-900: #144400;
--corrosive-green-950: #041700;
}