色名 · #D8D7CA
Light Livingstone
Light Livingstoneは#D8D7CA：rgb(216 215 202)、hsl(56 15% 82%)、oklch(0.876 0.018 103.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Light Livingstone color name →
#D8D7CA
oklch(0.876 0.018 103.2)
カラー変換
- HEX
- #d8d7ca
- RGB
- rgb(216 215 202)
- HSL
- hsl(56 15% 82%)
- HWB
- hwb(56 79% 15%)
- OKLCH
- oklch(0.876 0.018 103.2)
- OKLab
- oklab(0.876 -0.004 0.017)
- CIE Lab
- lab(85.79 -1.34 6.57)
- LCH
- lch(85.79 6.7 101.5)
- CMYK
- cmyk(0% 0% 6% 15%)
ティント · シェード · トーン
ティント
- DCDBCF
- E0DFD4
- E4E3DA
- E7E7DF
- EBEBE4
- EFEFEA
- F3F3EF
- F7F7F4
- FBFBFA
シェード
- BCBBAF
- A09F95
- 85857C
- 6B6B64
- 53524D
- 3B3B37
- 252522
- 11110F
- 020202
トーン
- CFCEC2
- C6C5BB
- BDBCB3
- B4B3AC
- ABAAA4
- A2A29D
- 999996
- 91918E
- 888887
カラーハーモニー
補色 +180°
- D8D7CA
Light Livingstone
- D4D5E2
≈ Hint of Violet
類似色 -30° +30°
- D8D7CA
Light Livingstone
- DED5CA
≈ Almond Beige
- D2D9CD
≈ Light Gentle Calm
トライアド +120° +240°
- D8D7CA
Light Livingstone
- CBD9DF
≈ Moonmist
- DFD2D9
≈ Timid Violet
スプリットコンプリメンタリー +150° +210°
- D8D7CA
Light Livingstone
- CED7E2
≈ Blue Reflection
- DAD3DF
≈ Spun Moonbeams
テトラード +90° +180° +270°
- D8D7CA
Light Livingstone
- CADAD9
≈ Cosmic Ray
- D4D5E2
≈ Hint of Violet
- E2D2D3
≈ Secret Blush
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.44:1 · APCA Lc 21
Ag
AAA黒の上
WCAG 14.49:1 · APCA Lc 82
最適な文字色: #000000
WCAG 14.49:1 (AAA) · APCA Lc 82
Contrast pairs
コードスニペット
CSS
:root {
--light-livingstone: #d8d7ca;
--light-livingstone-rgb: 216 215 202;
--light-livingstone-oklch: oklch(0.876 0.018 103.2);
}
.element {
color: var(--light-livingstone);
background-color: hsl(56 15% 82%);
border-color: oklch(0.876 0.018 103.2);
}Tailwind CSS v4
@theme {
--color-light-livingstone: #d8d7ca;
--color-light-livingstone-50: #f6f5f0;
--color-light-livingstone-100: #e8e8e2;
--color-light-livingstone-200: #d5d5cc;
--color-light-livingstone-300: #b8b8ae;
--color-light-livingstone-400: #a09f93;
--color-light-livingstone-500: #88877a;
--color-light-livingstone-600: #737267;
--color-light-livingstone-700: #5c5b52;
--color-light-livingstone-800: #43433c;
--color-light-livingstone-900: #2f2e29;
--color-light-livingstone-950: #1b1b17;
}SCSS
$light-livingstone: #d8d7ca;
$light-livingstone-rgb: 216, 215, 202;
$light-livingstone-light: mix(#fff, $light-livingstone, 20%);
$light-livingstone-dark: mix(#000, $light-livingstone, 20%);
.element {
color: $light-livingstone;
box-shadow: 0 0 0 2px rgba($light-livingstone, 0.35);
}