Named color · #009193
Common Teal
Common Teal is #009193: rgb(0 145 147), hsl(181 100% 29%), oklch(0.595 0.101 196.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Common Teal color name →
#009193
oklch(0.595 0.101 196.5)
Color conversions
- HEX
- #009193
- RGB
- rgb(0 145 147)
- HSL
- hsl(181 100% 29%)
- HWB
- hwb(181 0% 42%)
- OKLCH
- oklch(0.595 0.101 196.5)
- OKLab
- oklab(0.595 -0.097 -0.029)
- CIE Lab
- lab(54.1 -32.77 -10.89)
- LCH
- lch(54.1 34.53 198.4)
- CMYK
- cmyk(100% 1% 0% 42%)
Tints · Shades · Tones
Tints
- 379C9D
- 53A7A8
- 6BB2B2
- 82BDBD
- 97C8C8
- ACD3D3
- C1DEDE
- D6E9E9
- EAF4F4
Shades
- 007D7F
- 006A6C
- 005859
- 004647
- 003536
- 002525
- 001516
- 000708
- 000101
Tones
- 279091
- 398E8F
- 468C8D
- 518B8B
- 5B898A
- 638888
- 6B8686
- 738484
- 798282
Color harmonies
Complementary +180°
- 009193
Common Teal
- B36469
≈ Lasting Impression
Analogous -30° +30°
- 009193
Common Teal
- 359271
≈ Illuminating Emerald
- 298BAD
≈ Mediterranean Sea
Triadic +120° +240°
- 009193
Common Teal
- 976BA7
≈ Hyacinth
- A17630
≈ Natural Evolution
Split-complementary +150° +210°
- 009193
Common Teal
- AA658B
≈ Wild Mulberry
- B06B48
≈ Ebony Lips
Tetradic +90° +180° +270°
- 009193
Common Teal
- 7A75B8
≈ Purple Hebe
- B36469
≈ Lasting Impression
- 868333
≈ Majorca Green
Contrast & accessibility
Ag
FailOn white
WCAG 3.83:1 · APCA Lc 65
Ag
AAOn black
WCAG 5.47:1 · APCA Lc 36
Best text color: #000000
WCAG 5.47:1 (AA) · APCA Lc 36
Contrast pairs
Code snippets
CSS
:root {
--common-teal: #009193;
--common-teal-rgb: 0 145 147;
--common-teal-oklch: oklch(0.595 0.101 196.5);
}
.element {
color: var(--common-teal);
background-color: hsl(181 100% 29%);
border-color: oklch(0.595 0.101 196.5);
}Tailwind CSS v4
@theme {
--color-common-teal: #009193;
--color-common-teal-50: #d5ffff;
--color-common-teal-100: #c1f3f4;
--color-common-teal-200: #a1e2e4;
--color-common-teal-300: #75c8ca;
--color-common-teal-400: #47b1b2;
--color-common-teal-500: #009a9d;
--color-common-teal-600: #008284;
--color-common-teal-700: #00686a;
--color-common-teal-800: #004d4d;
--color-common-teal-900: #013635;
--color-common-teal-950: #002121;
}SCSS
$common-teal: #009193;
$common-teal-rgb: 0, 145, 147;
$common-teal-light: mix(#fff, $common-teal, 20%);
$common-teal-dark: mix(#000, $common-teal, 20%);
.element {
color: $common-teal;
box-shadow: 0 0 0 2px rgba($common-teal, 0.35);
}