Lightness-calibrated, unique natural hues for the tireless artisan
Warning
The project is under active development. Things are subject to change.
Light
| Swatch | Label | Hex | RGB | Okhsl (approx.) |
|---|---|---|---|---|
 |
Red | #dd0c25 |
rgb(221, 12, 37) |
okhsl(25, 99%, 50%) |
 |
Orange | #af6001 |
rgb(175, 96, 1) |
okhsl(59, 99%, 50%) |
 |
Yellow | #8e7502 |
rgb(142, 117, 2) |
okhsl(93, 99%, 50%) |
 |
Lime | #5a8705 |
rgb(90, 135, 5) |
okhsl(129, 99%, 50%) |
 |
Green | #068c65 |
rgb(6, 140, 101) |
okhsl(165, 99%, 50%) |
 |
Turquoise | #038981 |
rgb(3, 137, 129) |
okhsl(187, 99%, 50%) |
 |
Cyan | #028696 |
rgb(2, 134, 150) |
okhsl(209, 99%, 50%) |
 |
Cerulean | #0282ae |
rgb(2, 130, 174) |
okhsl(231, 99%, 50%) |
 |
Blue | #0476db |
rgb(4, 118, 219) |
okhsl(254, 99%, 50%) |
 |
Violet | #764bfe |
rgb(118, 75, 254) |
okhsl(287, 99%, 50%) |
 |
Lavender | #b607d7 |
rgb(182, 7, 215) |
okhsl(319, 99%, 50%) |
 |
Pink | #d30384 |
rgb(211, 3, 132) |
okhsl(352, 99%, 50%) |
 |
Red Back | #f2d5d2 |
rgb(242, 213, 210) |
okhsl(25, 51%, 88%) |
 |
Orange Back | #f1d8c4 |
rgb(241, 216, 196) |
okhsl(59, 51%, 88%) |
 |
Yellow Back | #e9ddb3 |
rgb(233, 221, 179) |
okhsl(93, 51%, 88%) |
 |
Lime Back | #cfe6b8 |
rgb(207, 230, 184) |
okhsl(129, 51%, 88%) |
 |
Green Back | #b9ead3 |
rgb(185, 234, 211) |
okhsl(165, 51%, 88%) |
 |
Turquoise Back | #b5e9e3 |
rgb(181, 233, 227) |
okhsl(187, 51%, 88%) |
 |
Cyan Back | #bbe6ee |
rgb(187, 230, 238) |
okhsl(209, 51%, 88%) |
 |
Cerulean Back | #c5e2f2 |
rgb(197, 226, 242) |
okhsl(231, 51%, 88%) |
 |
Blue Back | #cfdff3 |
rgb(207, 223, 243) |
okhsl(254, 51%, 88%) |
 |
Violet Back | #dbdaf3 |
rgb(219, 218, 243) |
okhsl(287, 51%, 88%) |
 |
Lavender Back | #e9d5ee |
rgb(233, 213, 238) |
okhsl(319, 51%, 88%) |
 |
Pink Back | #f1d4df |
rgb(241, 212, 223) |
okhsl(352, 51%, 88%) |
 |
Base 0 | #f5f3f1 |
rgb(245, 243, 241) |
okhsl(68, 12%, 96%) |
 |
Base 1 | #edeae7 |
rgb(237, 234, 231) |
okhsl(68, 11%, 93%) |
 |
Base 2 | #e6e2de |
rgb(230, 226, 222) |
okhsl(68, 10%, 90%) |
 |
Base 3 | #d6d1cb |
rgb(214, 209, 203) |
okhsl(68, 9%, 84%) |
 |
Base 4 | #c6c0ba |
rgb(198, 192, 186) |
okhsl(68, 8%, 78%) |
 |
Base 5 | #b6b0a9 |
rgb(182, 176, 169) |
okhsl(68, 7%, 72%) |
 |
Over 0 | #a5a09a |
rgb(165, 160, 154) |
okhsl(68, 6%, 66%) |
 |
Over 1 | #95908b |
rgb(149, 144, 139) |
okhsl(68, 5%, 60%) |
 |
Over 2 | #84817c |
rgb(132, 129, 124) |
okhsl(68, 4%, 54%) |
 |
Text 0 | #4d4d4c |
rgb(77, 77, 76) |
okhsl(68, 1%, 33%) |
 |
Text 1 | #5f5e5c |
rgb(95, 94, 92) |
okhsl(68, 2%, 40%) |
 |
Text 2 | #726f6c |
rgb(114, 111, 108) |
okhsl(68, 3%, 47%) |
Dark
| Swatch | Label | Hex | RGB | Okhsl (approx.) |
|---|---|---|---|---|
 |
Red | #ff9d94 |
rgb(255, 157, 148) |
okhsl(25, 100%, 76%) |
 |
Orange | #ffa353 |
rgb(255, 163, 83) |
okhsl(59, 100%, 76%) |
 |
Yellow | #dfb800 |
rgb(223, 184, 0) |
okhsl(93, 100%, 76%) |
 |
Lime | #90d400 |
rgb(144, 212, 0) |
okhsl(129, 100%, 76%) |
 |
Green | #00dca0 |
rgb(0, 220, 160) |
okhsl(165, 100%, 76%) |
 |
Turquoise | #00d8cb |
rgb(0, 216, 203) |
okhsl(187, 100%, 76%) |
 |
Cyan | #00d3eb |
rgb(0, 211, 235) |
okhsl(209, 100%, 76%) |
 |
Cerulean | #56caff |
rgb(86, 202, 255) |
okhsl(231, 100%, 76%) |
 |
Blue | #8bbfff |
rgb(139, 191, 255) |
okhsl(254, 100%, 76%) |
 |
Violet | #b6b1ff |
rgb(182, 177, 255) |
okhsl(287, 100%, 76%) |
 |
Lavender | #ea95ff |
rgb(234, 149, 255) |
okhsl(319, 100%, 76%) |
 |
Pink | #ff95c4 |
rgb(255, 149, 196) |
okhsl(352, 100%, 76%) |
 |
Red Back | #960d18 |
rgb(150, 13, 24) |
okhsl(25, 97%, 34%) |
 |
Orange Back | #763f02 |
rgb(118, 63, 2) |
okhsl(59, 97%, 34%) |
 |
Yellow Back | #5f4e03 |
rgb(95, 78, 3) |
okhsl(93, 97%, 34%) |
 |
Lime Back | #3c5a07 |
rgb(60, 90, 7) |
okhsl(129, 97%, 34%) |
 |
Green Back | #085e43 |
rgb(8, 94, 67) |
okhsl(165, 97%, 34%) |
 |
Turquoise Back | #045c56 |
rgb(4, 92, 86) |
okhsl(187, 97%, 34%) |
 |
Cyan Back | #035a65 |
rgb(3, 90, 101) |
okhsl(209, 97%, 34%) |
 |
Cerulean Back | #035776 |
rgb(3, 87, 118) |
okhsl(231, 97%, 34%) |
 |
Blue Back | #034f95 |
rgb(3, 79, 149) |
okhsl(254, 97%, 34%) |
 |
Violet Back | #5213c6 |
rgb(82, 19, 198) |
okhsl(287, 97%, 34%) |
 |
Lavender Back | #7c0493 |
rgb(124, 4, 147) |
okhsl(319, 97%, 34%) |
 |
Pink Back | #8f0259 |
rgb(143, 2, 89) |
okhsl(352, 97%, 34%) |
 |
Base 0 | #14171b |
rgb(20, 23, 27) |
okhsl(248, 9%, 10%) |
 |
Base 1 | #1a1e22 |
rgb(26, 30, 34) |
okhsl(248, 10%, 13%) |
 |
Base 2 | #21252a |
rgb(33, 37, 42) |
okhsl(248, 11%, 16%) |
 |
Base 3 | #33383d |
rgb(51, 56, 61) |
okhsl(248, 9%, 24%) |
 |
Base 4 | #464b51 |
rgb(70, 75, 81) |
okhsl(248, 8%, 32%) |
 |
Base 5 | #595f65 |
rgb(89, 95, 101) |
okhsl(248, 7%, 40%) |
 |
Over 0 | #6d7378 |
rgb(109, 115, 120) |
okhsl(248, 6%, 48%) |
 |
Over 1 | #82878c |
rgb(130, 135, 140) |
okhsl(248, 5%, 56%) |
 |
Over 2 | #989ca0 |
rgb(152, 156, 160) |
okhsl(248, 4%, 64%) |
 |
Text 0 | #dcdddd |
rgb(220, 221, 221) |
okhsl(248, 1%, 88%) |
 |
Text 1 | #c5c7c8 |
rgb(197, 199, 200) |
okhsl(248, 2%, 80%) |
 |
Text 2 | #aeb1b4 |
rgb(174, 177, 180) |
okhsl(248, 3%, 72%) |