色名 · #D4CFCC
Tiny Ghost Town
Tiny Ghost Townは#D4CFCC：rgb(212 207 204)、hsl(22 9% 82%)、oklch(0.858 0.007 53.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Tiny Ghost Town color name →
#D4CFCC
oklch(0.858 0.007 53.4)
カラー変換
- HEX
- #d4cfcc
- RGB
- rgb(212 207 204)
- HSL
- hsl(22 9% 82%)
- HWB
- hwb(22 80% 17%)
- OKLCH
- oklch(0.858 0.007 53.4)
- OKLab
- oklab(0.858 0.004 0.006)
- CIE Lab
- lab(83.46 1.39 2.14)
- LCH
- lch(83.46 2.55 57)
- CMYK
- cmyk(0% 2% 4% 17%)
ティント · シェード · トーン
ティント
- D8D4D1
- DCD8D6
- E1DDDB
- E5E2E0
- E9E7E5
- EEECEA
- F2F0EF
- F6F5F5
- FBFAFA
シェード
- B8B4B1
- 9D9997
- 837F7E
- 696765
- 514F4E
- 3A3837
- 242322
- 10100F
- 020202
トーン
- CBC7C4
- C3BFBC
- BAB7B5
- B1AFAD
- A9A7A5
- A19F9E
- 989796
- 908F8F
- 888887
カラーハーモニー
補色 +180°
- D4CFCC
Tiny Ghost Town
- CCD1D4
≈ Salina Springs
類似色 -30° +30°
- D4CFCC
Tiny Ghost Town
- D5CECE
≈ Dry Season
- D2D0CB
≈ Gazebo Grey
トライアド +120° +240°
- D4CFCC
Tiny Ghost Town
- CCD2D0
≈ Solo
- D0CFD4
≈ Ash Tree Bark
スプリットコンプリメンタリー +150° +210°
- D4CFCC
Tiny Ghost Town
- CBD2D2
≈ Misty
- CED0D5
≈ Ash Tree Bark
テトラード +90° +180° +270°
- D4CFCC
Tiny Ghost Town
- CED1CD
≈ Sheer Light
- CCD1D4
≈ Salina Springs
- D2CFD3
≈ Light Easter Rabbit
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.54:1 · APCA Lc 25
Ag
AAA黒の上
WCAG 13.59:1 · APCA Lc 78
最適な文字色: #000000
WCAG 13.59:1 (AAA) · APCA Lc 78
Contrast pairs
コードスニペット
CSS
:root {
--tiny-ghost-town: #d4cfcc;
--tiny-ghost-town-rgb: 212 207 204;
--tiny-ghost-town-oklch: oklch(0.858 0.007 53.4);
}
.element {
color: var(--tiny-ghost-town);
background-color: hsl(22 9% 82%);
border-color: oklch(0.858 0.007 53.4);
}Tailwind CSS v4
@theme {
--color-tiny-ghost-town: #d4cfcc;
--color-tiny-ghost-town-50: #f7f5f3;
--color-tiny-ghost-town-100: #eae7e6;
--color-tiny-ghost-town-200: #d7d3d1;
--color-tiny-ghost-town-300: #bab6b4;
--color-tiny-ghost-town-400: #a29d9b;
--color-tiny-ghost-town-500: #8a8582;
--color-tiny-ghost-town-600: #75716e;
--color-tiny-ghost-town-700: #5d5a58;
--color-tiny-ghost-town-800: #444240;
--color-tiny-ghost-town-900: #2f2d2c;
--color-tiny-ghost-town-950: #1c1a19;
}SCSS
$tiny-ghost-town: #d4cfcc;
$tiny-ghost-town-rgb: 212, 207, 204;
$tiny-ghost-town-light: mix(#fff, $tiny-ghost-town, 20%);
$tiny-ghost-town-dark: mix(#000, $tiny-ghost-town, 20%);
.element {
color: $tiny-ghost-town;
box-shadow: 0 0 0 2px rgba($tiny-ghost-town, 0.35);
}