色名 · #C2E3DD
Tidewater
Tidewaterは#C2E3DD：rgb(194 227 221)、hsl(169 37% 83%)、oklch(0.89 0.036 183.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Teal mean? → · Tidewater color name →
#C2E3DD
oklch(0.89 0.036 183.3)
カラー変換
- HEX
- #c2e3dd
- RGB
- rgb(194 227 221)
- HSL
- hsl(169 37% 83%)
- HWB
- hwb(169 76% 11%)
- OKLCH
- oklch(0.89 0.036 183.3)
- OKLab
- oklab(0.89 -0.036 -0.002)
- CIE Lab
- lab(87.71 -12.1 -0.89)
- LCH
- lch(87.71 12.14 184.2)
- CMYK
- cmyk(15% 0% 3% 11%)
ティント · シェード · トーン
ティント
- C8E6E0
- CEE9E4
- D4EBE7
- DBEEEA
- E1F1EE
- E7F4F1
- EDF7F5
- F3F9F8
- F9FCFC
シェード
- A8C5C0
- 8FA8A4
- 778C88
- 60716E
- 495755
- 343F3D
- 202726
- 0E1211
- 020302
トーン
- BBD9D3
- B5CECA
- AEC4C0
- A7BAB7
- A1B0AD
- 9AA6A4
- 949D9B
- 8D9392
- 878989
カラーハーモニー
補色 +180°
- C2E3DD
Tidewater
- F1D2D8
≈ Impatiens Petal
類似色 -30° +30°
- C2E3DD
Tidewater
- CAE2D0
≈ Enchanted
- C1E2E9
≈ Minified Jade
トライアド +120° +240°
- C2E3DD
Tidewater
- DFD6EF
≈ Japan Blush
- ECD6C3
≈ Rose Lotion
スプリットコンプリメンタリー +150° +210°
- C2E3DD
Tidewater
- EAD3E5
≈ Champagne Elegance
- F1D3CC
≈ Cool Cantaloupe
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.37:1 · APCA Lc 18
Ag
AAA黒の上
WCAG 15.32:1 · APCA Lc 85
最適な文字色: #000000
WCAG 15.32:1 (AAA) · APCA Lc 85
Contrast pairs
コードスニペット
CSS
:root {
--tidewater: #c2e3dd;
--tidewater-rgb: 194 227 221;
--tidewater-oklch: oklch(0.89 0.036 183.3);
}
.element {
color: var(--tidewater);
background-color: hsl(169 37% 83%);
border-color: oklch(0.89 0.036 183.3);
}Tailwind CSS v4
@theme {
--color-tidewater: #c2e3dd;
--color-tidewater-50: #ebf9f6;
--color-tidewater-100: #dcece9;
--color-tidewater-200: #c4d9d6;
--color-tidewater-300: #a4beba;
--color-tidewater-400: #88a6a0;
--color-tidewater-500: #6c8e88;
--color-tidewater-600: #5c7873;
--color-tidewater-700: #49605c;
--color-tidewater-800: #354743;
--color-tidewater-900: #24312e;
--color-tidewater-950: #131d1b;
}SCSS
$tidewater: #c2e3dd;
$tidewater-rgb: 194, 227, 221;
$tidewater-light: mix(#fff, $tidewater, 20%);
$tidewater-dark: mix(#000, $tidewater, 20%);
.element {
color: $tidewater;
box-shadow: 0 0 0 2px rgba($tidewater, 0.35);
}