Named color · #00A094
Alhambra
Alhambra is #00A094: rgb(0 160 148), hsl(176 100% 31%), oklch(0.635 0.112 185.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Teal mean? → · Alhambra color name →
#00A094
oklch(0.635 0.112 185.5)
Color conversions
- HEX
- #00a094
- RGB
- rgb(0 160 148)
- HSL
- hsl(176 100% 31%)
- HWB
- hwb(176 0% 37%)
- OKLCH
- oklch(0.635 0.112 185.5)
- OKLab
- oklab(0.635 -0.111 -0.011)
- CIE Lab
- lab(58.97 -38.58 -4.28)
- LCH
- lch(58.97 38.82 186.3)
- CMYK
- cmyk(100% 0% 7% 37%)
Tints · Shades · Tones
Tints
- 3AAA9E
- 57B3A9
- 6FBDB3
- 86C6BE
- 9BD0C8
- AFD9D3
- C3E3DE
- D7ECE9
- EBF6F4
Shades
- 008B80
- 00766D
- 00615A
- 004E48
- 003B36
- 002926
- 001916
- 000908
- 000101
Tones
- 299D92
- 3C9A90
- 49978E
- 54948C
- 5E918A
- 668D88
- 6D8A86
- 748784
- 7A8382
Color harmonies
Complementary +180°
- 00A094
Alhambra
- C36C81
≈ Pink Manhattan
Analogous -30° +30°
- 00A094
Alhambra
- 4A9E6D
≈ Basil Pesto
- 069BB5
≈ Barrier Reef
Triadic +120° +240°
- 00A094
Alhambra
- 9B78C0
≈ Purple Pride
- B87B39
≈ Molten Caramel
Split-complementary +150° +210°
- 00A094
Alhambra
- B46FA5
≈ Pink Parade
- C4705B
≈ Cajun Spice
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 3.25:1 · APCA Lc 59
Ag
AAOn black
WCAG 6.45:1 · APCA Lc 43
Best text color: #000000
WCAG 6.45:1 (AA) · APCA Lc 43
Contrast pairs
Code snippets
CSS
:root {
--alhambra: #00a094;
--alhambra-rgb: 0 160 148;
--alhambra-oklch: oklch(0.635 0.112 185.5);
}
.element {
color: var(--alhambra);
background-color: hsl(176 100% 31%);
border-color: oklch(0.635 0.112 185.5);
}Tailwind CSS v4
@theme {
--color-alhambra: #00a094;
--color-alhambra-50: #d2fffb;
--color-alhambra-100: #bef5ee;
--color-alhambra-200: #9ce4dd;
--color-alhambra-300: #6ecac1;
--color-alhambra-400: #3cb4a8;
--color-alhambra-500: #009d90;
--color-alhambra-600: #00857a;
--color-alhambra-700: #006b62;
--color-alhambra-800: #004f46;
--color-alhambra-900: #003731;
--color-alhambra-950: #00211d;
}SCSS
$alhambra: #00a094;
$alhambra-rgb: 0, 160, 148;
$alhambra-light: mix(#fff, $alhambra, 20%);
$alhambra-dark: mix(#000, $alhambra, 20%);
.element {
color: $alhambra;
box-shadow: 0 0 0 2px rgba($alhambra, 0.35);
}