色名 · #CFD9DE
Zen
Zenは#CFD9DE：rgb(207 217 222)、hsl(200 19% 84%)、oklch(0.879 0.013 228.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Zen color name →
#CFD9DE
oklch(0.879 0.013 228.9)
カラー変換
- HEX
- #cfd9de
- RGB
- rgb(207 217 222)
- HSL
- hsl(200 19% 84%)
- HWB
- hwb(200 81% 13%)
- OKLCH
- oklch(0.879 0.013 228.9)
- OKLab
- oklab(0.879 -0.008 -0.01)
- CIE Lab
- lab(86.03 -2.79 -3.7)
- LCH
- lch(86.03 4.63 233)
- CMYK
- cmyk(7% 2% 0% 13%)
ティント · シェード · トーン
ティント
- D4DDE1
- D8E1E5
- DDE4E8
- E2E8EB
- E7ECEE
- ECF0F2
- F0F3F5
- F5F7F8
- FAFBFC
シェード
- B4BCC1
- 99A1A5
- 7F8689
- 676C6F
- 4F5355
- 383B3D
- 232526
- 101112
- 020202
トーン
- C7D0D4
- BFC7CA
- B7BDC1
- AFB4B7
- A7ABAE
- 9FA3A4
- 979A9B
- 8F9192
- 888989
カラーハーモニー
補色 +180°
- CFD9DE
Zen
- DFD5D0
≈ Kyoto Pearl
類似色 -30° +30°
トライアド +120° +240°
スプリットコンプリメンタリー +150° +210°
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.43:1 · APCA Lc 21
Ag
AAA黒の上
WCAG 14.63:1 · APCA Lc 83
最適な文字色: #000000
WCAG 14.63:1 (AAA) · APCA Lc 83
Contrast pairs
コードスニペット
CSS
:root {
--zen: #cfd9de;
--zen-rgb: 207 217 222;
--zen-oklch: oklch(0.879 0.013 228.9);
}
.element {
color: var(--zen);
background-color: hsl(200 19% 84%);
border-color: oklch(0.879 0.013 228.9);
}Tailwind CSS v4
@theme {
--color-zen: #cfd9de;
--color-zen-50: #f2f6f8;
--color-zen-100: #e4e9eb;
--color-zen-200: #cfd5d9;
--color-zen-300: #b1b9bd;
--color-zen-400: #97a0a5;
--color-zen-500: #7e888d;
--color-zen-600: #6b7377;
--color-zen-700: #555c5f;
--color-zen-800: #3e4346;
--color-zen-900: #2b2e30;
--color-zen-950: #181b1d;
}SCSS
$zen: #cfd9de;
$zen-rgb: 207, 217, 222;
$zen-light: mix(#fff, $zen, 20%);
$zen-dark: mix(#000, $zen, 20%);
.element {
color: $zen;
box-shadow: 0 0 0 2px rgba($zen, 0.35);
}