色名 · #E1DDCD
Cappuccino Cosmico
Cappuccino Cosmicoは#E1DDCD：rgb(225 221 205)、hsl(48 25% 84%)、oklch(0.896 0.022 95.3)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Cappuccino Cosmico color name →
#E1DDCD
oklch(0.896 0.022 95.3)
カラー変換
- HEX
- #e1ddcd
- RGB
- rgb(225 221 205)
- HSL
- hsl(48 25% 84%)
- HWB
- hwb(48 80% 12%)
- OKLCH
- oklch(0.896 0.022 95.3)
- OKLab
- oklab(0.896 -0.002 0.022)
- CIE Lab
- lab(88.11 -0.62 8.39)
- LCH
- lch(88.11 8.42 94.3)
- CMYK
- cmyk(0% 2% 9% 12%)
ティント · シェード · トーン
ティント
- E4E0D2
- E7E4D7
- EAE7DC
- EDEBE1
- F0EEE6
- F3F1EB
- F6F5F0
- F9F8F5
- FCFCFA
シェード
- C4C0B2
- A7A498
- 8B887E
- 706E66
- 56554E
- 3E3D38
- 272623
- 12110F
- 020202
トーン
- D7D3C5
- CDCABD
- C3C0B5
- B9B7AD
- AFADA6
- A6A49E
- 9C9B96
- 93928F
- 898987
カラーハーモニー
補色 +180°
- E1DDCD
Cappuccino Cosmico
- D8DCEC
≈ Weeping Wisteria
類似色 -30° +30°
- E1DDCD
Cappuccino Cosmico
- E7DACE
≈ Malted Milk
- D9E0D0
≈ Light Ligado
トライアド +120° +240°
- E1DDCD
Cappuccino Cosmico
- CDE1E6
≈ Cool Sky
- E7D8E3
≈ Rajah Rose
スプリットコンプリメンタリー +150° +210°
- E1DDCD
Cappuccino Cosmico
- D1DFEB
≈ Happy Thoughts
- E0D9E9
≈ Awakened
テトラード +90° +180° +270°
- E1DDCD
Cappuccino Cosmico
- CEE2DF
≈ Big Sky
- D8DCEC
≈ Weeping Wisteria
- EBD7DB
≈ Berry Taffy
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.36:1 · APCA Lc 18
Ag
AAA黒の上
WCAG 15.42:1 · APCA Lc 86
最適な文字色: #000000
WCAG 15.42:1 (AAA) · APCA Lc 86
Contrast pairs
コードスニペット
CSS
:root {
--cappuccino-cosmico: #e1ddcd;
--cappuccino-cosmico-rgb: 225 221 205;
--cappuccino-cosmico-oklch: oklch(0.896 0.022 95.3);
}
.element {
color: var(--cappuccino-cosmico);
background-color: hsl(48 25% 84%);
border-color: oklch(0.896 0.022 95.3);
}Tailwind CSS v4
@theme {
--color-cappuccino-cosmico: #e1ddcd;
--color-cappuccino-cosmico-50: #f7f5ee;
--color-cappuccino-cosmico-100: #eae8e0;
--color-cappuccino-cosmico-200: #d7d4ca;
--color-cappuccino-cosmico-300: #bab8ab;
--color-cappuccino-cosmico-400: #a29f90;
--color-cappuccino-cosmico-500: #8a8676;
--color-cappuccino-cosmico-600: #757264;
--color-cappuccino-cosmico-700: #5e5b50;
--color-cappuccino-cosmico-800: #45423a;
--color-cappuccino-cosmico-900: #302e28;
--color-cappuccino-cosmico-950: #1c1b16;
}SCSS
$cappuccino-cosmico: #e1ddcd;
$cappuccino-cosmico-rgb: 225, 221, 205;
$cappuccino-cosmico-light: mix(#fff, $cappuccino-cosmico, 20%);
$cappuccino-cosmico-dark: mix(#000, $cappuccino-cosmico, 20%);
.element {
color: $cappuccino-cosmico;
box-shadow: 0 0 0 2px rgba($cappuccino-cosmico, 0.35);
}