Benannte Farbe · #99B1A2
Phoenix Tears
Phoenix Tears ist #99B1A2: rgb(153 177 162), hsl(143 13% 65%), oklch(0.738 0.034 158). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Phoenix Tears color name →
#99B1A2
oklch(0.738 0.034 158)
Farbumrechnungen
- HEX
- #99b1a2
- RGB
- rgb(153 177 162)
- HSL
- hsl(143 13% 65%)
- HWB
- hwb(143 60% 31%)
- OKLCH
- oklch(0.738 0.034 158)
- OKLab
- oklab(0.738 -0.032 0.013)
- CIE Lab
- lab(70.03 -10.83 4.78)
- LCH
- lch(70.03 11.83 156.2)
- CMYK
- cmyk(14% 0% 8% 31%)
Tints · Shades · Tones
Tints
- A3B9AB
- ADC0B4
- B7C8BD
- C1D0C6
- CBD7D0
- D5DFD9
- E0E7E2
- EAEFEC
- F4F7F5
Shades
- 84998C
- 708377
- 5D6C63
- 4A574F
- 38423C
- 272F2A
- 171C19
- 080C0A
- 010101
Tones
- 97AC9F
- 94A79B
- 92A298
- 8F9D94
- 8D9891
- 8A938D
- 888E8A
- 858A87
- 838583
Farbharmonien
Komplementär +180°
- 99B1A2
Phoenix Tears
- B9A2B2
≈ Parlour Rose
Analog -30° +30°
- 99B1A2
Phoenix Tears
- A4AF98
≈ Ending Spring
- 93B1AE
≈ Undersea
Triadisch +120° +240°
- 99B1A2
Phoenix Tears
- A5A8C0
≈ Wisteria Light Soft Blue
- BEA39B
≈ Mohair Mauve
Geteilt komplementär +150° +210°
- 99B1A2
Phoenix Tears
- B0A5BB
≈ Bellflower Violet
- BEA2A6
≈ Tourmaline Mauve
Tetradisch +90° +180° +270°
- 99B1A2
Phoenix Tears
- 9AADBF
≈ Soaring Eagle
- B9A2B2
≈ Parlour Rose
- B9A794
≈ Desert Sandstorm
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.29:1 · APCA Lc 45
Ag
AAAAuf Schwarz
WCAG 9.16:1 · APCA Lc 57
Beste Textfarbe: #000000
WCAG 9.16:1 (AAA) · APCA Lc 57
Contrast pairs
Code-Snippets
CSS
:root {
--phoenix-tears: #99b1a2;
--phoenix-tears-rgb: 153 177 162;
--phoenix-tears-oklch: oklch(0.738 0.034 158);
}
.element {
color: var(--phoenix-tears);
background-color: hsl(143 13% 65%);
border-color: oklch(0.738 0.034 158);
}Tailwind CSS v4
@theme {
--color-phoenix-tears: #99b1a2;
--color-phoenix-tears-50: #edf8f2;
--color-phoenix-tears-100: #dfece4;
--color-phoenix-tears-200: #c8d9cf;
--color-phoenix-tears-300: #a9bdb1;
--color-phoenix-tears-400: #8ea597;
--color-phoenix-tears-500: #748d7e;
--color-phoenix-tears-600: #62786a;
--color-phoenix-tears-700: #4e6055;
--color-phoenix-tears-800: #39463d;
--color-phoenix-tears-900: #27302a;
--color-phoenix-tears-950: #151d18;
}SCSS
$phoenix-tears: #99b1a2;
$phoenix-tears-rgb: 153, 177, 162;
$phoenix-tears-light: mix(#fff, $phoenix-tears, 20%);
$phoenix-tears-dark: mix(#000, $phoenix-tears, 20%);
.element {
color: $phoenix-tears;
box-shadow: 0 0 0 2px rgba($phoenix-tears, 0.35);
}