最も近い色名 · #E0CCA9
#E0CCA9
最も近い色名: Boutique Beige
#E0CCA9（rgb(224 204 169)、hsl(38 47% 77%)、oklch(0.853 0.052 81.6)）に最も近い色名はBoutique Beigeです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#E0CCA9
oklch(0.853 0.052 81.6)
カラー変換
- HEX
- #e0cca9
- RGB
- rgb(224 204 169)
- HSL
- hsl(38 47% 77%)
- HWB
- hwb(38 66% 12%)
- OKLCH
- oklch(0.853 0.052 81.6)
- OKLab
- oklab(0.853 0.008 0.051)
- CIE Lab
- lab(83.06 3.25 20.19)
- LCH
- lch(83.06 20.45 80.8)
- CMYK
- cmyk(0% 9% 25% 12%)
ティント · シェード · トーン
ティント
- E3D1B2
- E6D6BA
- E9DBC3
- ECE0CB
- F0E5D4
- F3EBDC
- F6F0E5
- F9F5EE
- FCFAF6
シェード
- C3B192
- A6977C
- 8A7E67
- 706553
- 564E3F
- 3E372C
- 27221B
- 120F0A
- 020201
トーン
- D6C4A5
- CCBCA1
- C2B59D
- B9AD99
- AFA595
- A59E91
- 9C968C
- 928F88
- 898784
カラーハーモニー
補色 +180°
- E0CCA9
Boutique Beige
- BCD0F1
≈ Frost Fairy
類似色 -30° +30°
- E0CCA9
Boutique Beige
- EBC6B0
≈ Pinkham
- CFD3AC
≈ Olive Martini
トライアド +120° +240°
- E0CCA9
Boutique Beige
- A8D9DD
≈ Crystal
- DFC4E3
≈ Glittering Gemstone
スプリットコンプリメンタリー +150° +210°
- E0CCA9
Boutique Beige
- ADD5EB
≈ Ariel
- CEC9EF
≈ Soap
テトラード +90° +180° +270°
- E0CCA9
Boutique Beige
- ADDACA
≈ Prism
- BCD0F1
≈ Frost Fairy
- EBC1D2
≈ Guava Glow
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.56:1 · APCA Lc 26
Ag
AAA黒の上
WCAG 13.37:1 · APCA Lc 77
最適な文字色: #000000
WCAG 13.37:1 (AAA) · APCA Lc 77
Contrast pairs
コードスニペット
CSS
:root {
--boutique-beige: #e0cca9;
--boutique-beige-rgb: 224 204 169;
--boutique-beige-oklch: oklch(0.853 0.052 81.6);
}
.element {
color: var(--boutique-beige);
background-color: hsl(38 47% 77%);
border-color: oklch(0.853 0.052 81.6);
}Tailwind CSS v4
@theme {
--color-boutique-beige: #e0cca9;
--color-boutique-beige-50: #fcf4e5;
--color-boutique-beige-100: #f0e7d5;
--color-boutique-beige-200: #dfd3bc;
--color-boutique-beige-300: #c4b69a;
--color-boutique-beige-400: #ae9c7c;
--color-boutique-beige-500: #98835f;
--color-boutique-beige-600: #806f51;
--color-boutique-beige-700: #675940;
--color-boutique-beige-800: #4c412e;
--color-boutique-beige-900: #352c1f;
--color-boutique-beige-950: #20190f;
}SCSS
$boutique-beige: #e0cca9;
$boutique-beige-rgb: 224, 204, 169;
$boutique-beige-light: mix(#fff, $boutique-beige, 20%);
$boutique-beige-dark: mix(#000, $boutique-beige, 20%);
.element {
color: $boutique-beige;
box-shadow: 0 0 0 2px rgba($boutique-beige, 0.35);
}