色名 · #CCBBAA
Smoke Dragon
Smoke Dragonは#CCBBAA：rgb(204 187 170)、hsl(30 25% 73%)、oklch(0.802 0.03 67.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Smoke Dragon color name →
#CCBBAA
oklch(0.802 0.03 67.4)
カラー変換
- HEX
- #ccbbaa
- RGB
- rgb(204 187 170)
- HSL
- hsl(30 25% 73%)
- HWB
- hwb(30 67% 20%)
- OKLCH
- oklch(0.802 0.03 67.4)
- OKLab
- oklab(0.802 0.012 0.028)
- CIE Lab
- lab(76.98 4.17 10.94)
- LCH
- lch(76.98 11.71 69.2)
- CMYK
- cmyk(0% 8% 17% 20%)
ティント · シェード · トーン
ティント
- D1C2B2
- D6C8BB
- DBCFC3
- E0D6CB
- E5DDD4
- EAE3DC
- F0EAE5
- F5F1EE
- FAF8F6
シェード
- B1A293
- 978A7D
- 7E7368
- 655C53
- 4E463F
- 37322D
- 221F1B
- 0F0D0B
- 020201
トーン
- C4B5A6
- BCAFA2
- B5A99D
- ADA399
- A59D95
- 9E9791
- 96918C
- 8F8C88
- 878684
カラーハーモニー
補色 +180°
- CCBBAA
Smoke Dragon
- AFC1D1
≈ Airway
類似色 -30° +30°
- CCBBAA
Smoke Dragon
- D1B8B1
≈ Cracker Crumbs
- C3BFA9
≈ Rippling Stone
トライアド +120° +240°
- CCBBAA
Smoke Dragon
- A9C5C1
≈ Peppermint Pie
- C3B9CE
≈ Fog Syringa
スプリットコンプリメンタリー +150° +210°
- CCBBAA
Smoke Dragon
- A9C4CB
≈ Robin’s Pride
- B9BDD2
≈ Violet Vision
テトラード +90° +180° +270°
- CCBBAA
Smoke Dragon
- AFC5B7
≈ Pine Whisper
- AFC1D1
≈ Airway
- CCB7C5
≈ Ballad
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.86:1 · APCA Lc 35
Ag
AAA黒の上
WCAG 11.25:1 · APCA Lc 67
最適な文字色: #000000
WCAG 11.25:1 (AAA) · APCA Lc 67
Contrast pairs
コードスニペット
CSS
:root {
--smoke-dragon: #ccbbaa;
--smoke-dragon-rgb: 204 187 170;
--smoke-dragon-oklch: oklch(0.802 0.03 67.4);
}
.element {
color: var(--smoke-dragon);
background-color: hsl(30 25% 73%);
border-color: oklch(0.802 0.03 67.4);
}Tailwind CSS v4
@theme {
--color-smoke-dragon: #ccbbaa;
--color-smoke-dragon-50: #fbf4ec;
--color-smoke-dragon-100: #efe6dd;
--color-smoke-dragon-200: #ddd2c7;
--color-smoke-dragon-300: #c2b5a7;
--color-smoke-dragon-400: #ab9b8c;
--color-smoke-dragon-500: #948371;
--color-smoke-dragon-600: #7d6f60;
--color-smoke-dragon-700: #64584c;
--color-smoke-dragon-800: #4a4037;
--color-smoke-dragon-900: #332c26;
--color-smoke-dragon-950: #1f1914;
}SCSS
$smoke-dragon: #ccbbaa;
$smoke-dragon-rgb: 204, 187, 170;
$smoke-dragon-light: mix(#fff, $smoke-dragon, 20%);
$smoke-dragon-dark: mix(#000, $smoke-dragon, 20%);
.element {
color: $smoke-dragon;
box-shadow: 0 0 0 2px rgba($smoke-dragon, 0.35);
}