色名 · #CFD5DB
Satin White
Satin Whiteは#CFD5DB：rgb(207 213 219)、hsl(210 14% 84%)、oklch(0.87 0.011 247.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Satin White color name →
#CFD5DB
oklch(0.87 0.011 247.9)
カラー変換
- HEX
- #cfd5db
- RGB
- rgb(207 213 219)
- HSL
- hsl(210 14% 84%)
- HWB
- hwb(210 81% 14%)
- OKLCH
- oklch(0.87 0.011 247.9)
- OKLab
- oklab(0.87 -0.004 -0.01)
- CIE Lab
- lab(84.93 -1.27 -3.72)
- LCH
- lch(84.93 3.93 251.2)
- CMYK
- cmyk(5% 3% 0% 14%)
ティント · シェード · トーン
ティント
- D4D9DF
- D8DDE2
- DDE1E6
- E2E6E9
- E7EAED
- ECEEF0
- F0F2F4
- F5F6F8
- FAFBFB
シェード
- B4B9BE
- 999EA2
- 7F8387
- 676A6D
- 4F5154
- 383A3C
- 232426
- 101011
- 020202
トーン
- C7CCD2
- BFC3C8
- B7BBBF
- AFB2B6
- A7AAAC
- 9FA1A3
- 97999A
- 8F9091
- 888889
カラーハーモニー
補色 +180°
- CFD5DB
Satin White
- D9D3CD
≈ Baked Biscotti
類似色 -30° +30°
- CFD5DB
Satin White
- CDD6D9
≈ White Blue
- D2D4DB
≈ Blueberry Whip
トライアド +120° +240°
- CFD5DB
Satin White
- DBD1D3
≈ Blush of Morn
- D2D6CE
≈ Close Knit
スプリットコンプリメンタリー +150° +210°
- CFD5DB
Satin White
- DBD2CF
≈ Tranquil Retreat
- D6D4CD
≈ Slow Perch
テトラード +90° +180° +270°
- CFD5DB
Satin White
- D9D2D7
≈ Light Limpid Light
- D9D3CD
≈ Baked Biscotti
- CFD6D2
≈ Old Sterling
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.47:1 · APCA Lc 23
Ag
AAA黒の上
WCAG 14.19:1 · APCA Lc 81
最適な文字色: #000000
WCAG 14.19:1 (AAA) · APCA Lc 81
Contrast pairs
コードスニペット
CSS
:root {
--satin-white: #cfd5db;
--satin-white-rgb: 207 213 219;
--satin-white-oklch: oklch(0.87 0.011 247.9);
}
.element {
color: var(--satin-white);
background-color: hsl(210 14% 84%);
border-color: oklch(0.87 0.011 247.9);
}Tailwind CSS v4
@theme {
--color-satin-white: #cfd5db;
--color-satin-white-50: #f3f5f8;
--color-satin-white-100: #e5e8eb;
--color-satin-white-200: #d1d5d9;
--color-satin-white-300: #b3b8bd;
--color-satin-white-400: #9a9fa4;
--color-satin-white-500: #81878d;
--color-satin-white-600: #6d7277;
--color-satin-white-700: #575b5f;
--color-satin-white-800: #3f4346;
--color-satin-white-900: #2c2e30;
--color-satin-white-950: #191b1d;
}SCSS
$satin-white: #cfd5db;
$satin-white-rgb: 207, 213, 219;
$satin-white-light: mix(#fff, $satin-white, 20%);
$satin-white-dark: mix(#000, $satin-white, 20%);
.element {
color: $satin-white;
box-shadow: 0 0 0 2px rgba($satin-white, 0.35);
}