色名 · #D6DFEC
Faint Blue
Faint Blueは#D6DFEC：rgb(214 223 236)、hsl(215 37% 88%)、oklch(0.901 0.02 257.5)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Faint Blue color name →
#D6DFEC
oklch(0.901 0.02 257.5)
カラー変換
- HEX
- #d6dfec
- RGB
- rgb(214 223 236)
- HSL
- hsl(215 37% 88%)
- HWB
- hwb(215 84% 7%)
- OKLCH
- oklch(0.901 0.02 257.5)
- OKLab
- oklab(0.901 -0.004 -0.02)
- CIE Lab
- lab(88.42 -1.28 -7.47)
- LCH
- lch(88.42 7.58 260.3)
- CMYK
- cmyk(9% 6% 0% 7%)
ティント · シェード · トーン
ティント
- DAE2EE
- DEE5F0
- E2E9F2
- E6ECF4
- EAEFF6
- EEF2F7
- F3F5F9
- F7F9FB
- FBFCFD
シェード
- BAC2CD
- 9EA5AF
- 848A92
- 6A6F76
- 52565B
- 3B3D42
- 252729
- 101213
- 020203
トーン
- CDD5E1
- C4CBD5
- BBC2CA
- B3B8BF
- AAAEB5
- A1A5AA
- 999B9F
- 919295
- 88898A
カラーハーモニー
補色 +180°
- D6DFEC
Faint Blue
- E6DDD0
≈ Pacer White
類似色 -30° +30°
- D6DFEC
Faint Blue
- D1E1E9
≈ Goddess
- DDDCEB
≈ Artemis Silver
トライアド +120° +240°
- D6DFEC
Faint Blue
- ECD9D9
≈ Hyper Light Drifter
- D8E2D5
≈ Green Mirror
スプリットコンプリメンタリー +150° +210°
- D6DFEC
Faint Blue
- EADBD3
≈ Hudson
- DFDFD0
≈ Corinthian Column
テトラード +90° +180° +270°
- D6DFEC
Faint Blue
- E9D9E1
≈ Rajah Rose
- E6DDD0
≈ Pacer White
- D2E3DB
≈ Delicate Snow Goose
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.34:1 · APCA Lc 17
Ag
AAA黒の上
WCAG 15.62:1 · APCA Lc 87
最適な文字色: #000000
WCAG 15.62:1 (AAA) · APCA Lc 87
Contrast pairs
コードスニペット
CSS
:root {
--faint-blue: #d6dfec;
--faint-blue-rgb: 214 223 236;
--faint-blue-oklch: oklch(0.901 0.02 257.5);
}
.element {
color: var(--faint-blue);
background-color: hsl(215 37% 88%);
border-color: oklch(0.901 0.02 257.5);
}Tailwind CSS v4
@theme {
--color-faint-blue: #d6dfec;
--color-faint-blue-50: #f2f5fb;
--color-faint-blue-100: #e4e8ef;
--color-faint-blue-200: #cfd5dd;
--color-faint-blue-300: #b1b8c2;
--color-faint-blue-400: #979fab;
--color-faint-blue-500: #7e8794;
--color-faint-blue-600: #6b727d;
--color-faint-blue-700: #555b64;
--color-faint-blue-800: #3e4349;
--color-faint-blue-900: #2a2e33;
--color-faint-blue-950: #181b1f;
}SCSS
$faint-blue: #d6dfec;
$faint-blue-rgb: 214, 223, 236;
$faint-blue-light: mix(#fff, $faint-blue, 20%);
$faint-blue-dark: mix(#000, $faint-blue, 20%);
.element {
color: $faint-blue;
box-shadow: 0 0 0 2px rgba($faint-blue, 0.35);
}