Named color · #006B56
Poster Green
Poster Green is #006B56: rgb(0 107 86), hsl(168 100% 21%), oklch(0.47 0.09 173). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Poster Green color name →
#006B56
oklch(0.47 0.09 173)
Color conversions
- HEX
- #006b56
- RGB
- rgb(0 107 86)
- HSL
- hsl(168 100% 21%)
- HWB
- hwb(168 0% 58%)
- OKLCH
- oklch(0.47 0.09 173)
- OKLab
- oklab(0.47 -0.09 0.011)
- CIE Lab
- lab(39.76 -31.81 3.97)
- LCH
- lch(39.76 32.05 172.9)
- CMYK
- cmyk(100% 0% 20% 58%)
Tints · Shades · Tones
Tints
- 2D7965
- 488775
- 5F9685
- 76A496
- 8DB3A7
- A3C2B8
- BAD1C9
- D1E0DB
- E8F0ED
Shades
- 005C4A
- 004E3E
- 003F32
- 003227
- 00251C
- 001812
- 000D08
- 000402
- 000000
Tones
- 1F6D5A
- 2F705E
- 3C7262
- 477466
- 52766B
- 5C786F
- 657A73
- 6E7C77
- 777E7C
Color harmonies
Complementary +180°
- 006B56
Poster Green
- 81445F
≈ Wild Plum
Analogous -30° +30°
- 006B56
Poster Green
- 3A6838
≈ Vegas Green
- 00686F
≈ Tahitian Treat
Triadic +120° +240°
- 006B56
Poster Green
- 5D5089
≈ Bright Eggplant
- 824B26
≈ Mummy Brown
Split-complementary +150° +210°
- 006B56
Poster Green
- 734978
≈ Cabbage Blossom Violet
- 864543
≈ Fired Clay
Tetradic +90° +180° +270°
- 006B56
Poster Green
- 3F5A8E
≈ Lambent Lagoon
- 81445F
≈ Wild Plum
- 73550F
≈ Coffee Adept
Contrast & accessibility
Ag
AAOn white
WCAG 6.48:1 · APCA Lc 82
Ag
FailOn black
WCAG 3.23:1 · APCA Lc 20
Best text color: #FFFFFF
WCAG 6.48:1 (AA) · APCA Lc 82
Contrast pairs
Code snippets
CSS
:root {
--poster-green: #006b56;
--poster-green-rgb: 0 107 86;
--poster-green-oklch: oklch(0.47 0.09 173);
}
.element {
color: var(--poster-green);
background-color: hsl(168 100% 21%);
border-color: oklch(0.47 0.09 173);
}Tailwind CSS v4
@theme {
--color-poster-green: #006b56;
--color-poster-green-50: #dcfef4;
--color-poster-green-100: #caf2e6;
--color-poster-green-200: #ace1d2;
--color-poster-green-300: #85c7b5;
--color-poster-green-400: #61b099;
--color-poster-green-500: #379980;
--color-poster-green-600: #30826d;
--color-poster-green-700: #266857;
--color-poster-green-800: #1b4c3e;
--color-poster-green-900: #12352b;
--color-poster-green-950: #042018;
}SCSS
$poster-green: #006b56;
$poster-green-rgb: 0, 107, 86;
$poster-green-light: mix(#fff, $poster-green, 20%);
$poster-green-dark: mix(#000, $poster-green, 20%);
.element {
color: $poster-green;
box-shadow: 0 0 0 2px rgba($poster-green, 0.35);
}