Nazwany kolor · #809899
Tidepool Wonder
Tidepool Wonder to #809899: rgb(128 152 153), hsl(182 11% 55%), oklch(0.661 0.027 199.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Tidepool Wonder color name →
#809899
oklch(0.661 0.027 199.6)
Konwersje koloru
- HEX
- #809899
- RGB
- rgb(128 152 153)
- HSL
- hsl(182 11% 55%)
- HWB
- hwb(182 50% 40%)
- OKLCH
- oklch(0.661 0.027 199.6)
- OKLab
- oklab(0.661 -0.026 -0.009)
- CIE Lab
- lab(61 -8.6 -3.51)
- LCH
- lch(61 9.29 202.2)
- CMYK
- cmyk(16% 1% 0% 40%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8CA2A3
- 98ACAD
- A5B6B7
- B1C0C1
- BECACB
- CBD5D5
- D8DFDF
- E5EAEA
- F2F4F4
Odcienie ciemniejsze
- 6E8484
- 5D7070
- 4D5C5D
- 3D4A4A
- 2E3838
- 1F2727
- 121717
- 060808
- 010101
Tony
- 809696
- 809394
- 809191
- 808E8F
- 808C8C
- 808A8A
- 808787
- 808585
- 808282
Harmonie kolorów
Komplementarna +180°
- 809899
Tidepool Wonder
- A38C8C
≈ Delicate Brown
Analogowa -30° +30°
- 809899
Tidepool Wonder
- 839890
≈ In the Moment
- 8296A0
≈ Poolhouse
Triada +120° +240°
- 809899
Tidepool Wonder
- 9A8E9D
≈ Duchess Lilac
- 9C9180
≈ Shadow Taupe
Komplementarna rozszczepiona +150° +210°
- 809899
Tidepool Wonder
- A08C95
≈ Gothic Amethyst
- A18E84
≈ Bush Buck
Tetrada +90° +180° +270°
- 809899
Tidepool Wonder
- 9290A3
≈ Cotton Flannel
- A38C8C
≈ Delicate Brown
- 939481
≈ Restoration
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.05:1 · APCA Lc 57
Ag
AANa czerni
WCAG 6.86:1 · APCA Lc 44
Najlepszy kolor tekstu: #000000
WCAG 6.86:1 (AA) · APCA Lc 44
Contrast pairs
Fragmenty kodu
CSS
:root {
--tidepool-wonder: #809899;
--tidepool-wonder-rgb: 128 152 153;
--tidepool-wonder-oklch: oklch(0.661 0.027 199.6);
}
.element {
color: var(--tidepool-wonder);
background-color: hsl(182 11% 55%);
border-color: oklch(0.661 0.027 199.6);
}Tailwind CSS v4
@theme {
--color-tidepool-wonder: #809899;
--color-tidepool-wonder-50: #edf8f8;
--color-tidepool-wonder-100: #deebec;
--color-tidepool-wonder-200: #c8d8d9;
--color-tidepool-wonder-300: #a8bcbd;
--color-tidepool-wonder-400: #8da4a5;
--color-tidepool-wonder-500: #728c8d;
--color-tidepool-wonder-600: #607677;
--color-tidepool-wonder-700: #4d5f5f;
--color-tidepool-wonder-800: #384546;
--color-tidepool-wonder-900: #263030;
--color-tidepool-wonder-950: #141c1c;
}SCSS
$tidepool-wonder: #809899;
$tidepool-wonder-rgb: 128, 152, 153;
$tidepool-wonder-light: mix(#fff, $tidepool-wonder, 20%);
$tidepool-wonder-dark: mix(#000, $tidepool-wonder, 20%);
.element {
color: $tidepool-wonder;
box-shadow: 0 0 0 2px rgba($tidepool-wonder, 0.35);
}