色名 · #809899
Tidepool Wonder
Tidepool Wonderは#809899：rgb(128 152 153)、hsl(182 11% 55%)、oklch(0.661 0.027 199.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Tidepool Wonder color name →
#809899
oklch(0.661 0.027 199.6)
カラー変換
- 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%)
ティント · シェード · トーン
ティント
- 8CA2A3
- 98ACAD
- A5B6B7
- B1C0C1
- BECACB
- CBD5D5
- D8DFDF
- E5EAEA
- F2F4F4
シェード
- 6E8484
- 5D7070
- 4D5C5D
- 3D4A4A
- 2E3838
- 1F2727
- 121717
- 060808
- 010101
トーン
- 809696
- 809394
- 809191
- 808E8F
- 808C8C
- 808A8A
- 808787
- 808585
- 808282
カラーハーモニー
補色 +180°
- 809899
Tidepool Wonder
- A38C8C
≈ Delicate Brown
類似色 -30° +30°
- 809899
Tidepool Wonder
- 839890
≈ In the Moment
- 8296A0
≈ Poolhouse
トライアド +120° +240°
- 809899
Tidepool Wonder
- 9A8E9D
≈ Duchess Lilac
- 9C9180
≈ Shadow Taupe
スプリットコンプリメンタリー +150° +210°
- 809899
Tidepool Wonder
- A08C95
≈ Gothic Amethyst
- A18E84
≈ Bush Buck
テトラード +90° +180° +270°
- 809899
Tidepool Wonder
- 9290A3
≈ Cotton Flannel
- A38C8C
≈ Delicate Brown
- 939481
≈ Restoration
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.05:1 · APCA Lc 57
Ag
AA黒の上
WCAG 6.86:1 · APCA Lc 44
最適な文字色: #000000
WCAG 6.86:1 (AA) · APCA Lc 44
Contrast pairs
コードスニペット
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);
}