色名 · #E2DDC7
Travertine
Travertineは#E2DDC7：rgb(226 221 199)、hsl(49 32% 83%)、oklch(0.896 0.03 96.4)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Travertine color name →
#E2DDC7
oklch(0.896 0.03 96.4)
カラー変換
- HEX
- #e2ddc7
- RGB
- rgb(226 221 199)
- HSL
- hsl(49 32% 83%)
- HWB
- hwb(49 78% 11%)
- OKLCH
- oklch(0.896 0.03 96.4)
- OKLab
- oklab(0.896 -0.003 0.03)
- CIE Lab
- lab(88.07 -0.98 11.48)
- LCH
- lch(88.07 11.53 94.9)
- CMYK
- cmyk(0% 2% 12% 11%)
ティント · シェード · トーン
ティント
- E5E0CD
- E8E4D2
- EBE7D8
- EEEBDD
- F0EEE3
- F3F1E8
- F6F5EE
- F9F8F4
- FCFCF9
シェード
- C4C0AD
- A8A493
- 8C887A
- 716E62
- 57554C
- 3E3D36
- 272621
- 12110E
- 030202
トーン
- D8D3C0
- CECAB8
- C4C0B1
- BAB7AA
- B0ADA3
- A6A49C
- 9C9B95
- 93928E
- 898987
カラーハーモニー
補色 +180°
- E2DDC7
Travertine
- D7DBF1
≈ Blissful Meditation
類似色 -30° +30°
- E2DDC7
Travertine
- EBD9C8
≈ Sandpiper
- D7E1CC
≈ Gratifying Green
トライアド +120° +240°
- E2DDC7
Travertine
- C7E2E9
≈ Gauzy Calico
- EAD5E4
≈ Champagne Elegance
スプリットコンプリメンタリー +150° +210°
- E2DDC7
Travertine
- CDDFF0
≈ Vanishing Blue
- E1D8ED
≈ Old Chalk
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.36:1 · APCA Lc 18
Ag
AAA黒の上
WCAG 15.40:1 · APCA Lc 86
最適な文字色: #000000
WCAG 15.40:1 (AAA) · APCA Lc 86
Contrast pairs
コードスニペット
CSS
:root {
--travertine: #e2ddc7;
--travertine-rgb: 226 221 199;
--travertine-oklch: oklch(0.896 0.03 96.4);
}
.element {
color: var(--travertine);
background-color: hsl(49 32% 83%);
border-color: oklch(0.896 0.03 96.4);
}Tailwind CSS v4
@theme {
--color-travertine: #e2ddc7;
--color-travertine-50: #f7f5ec;
--color-travertine-100: #eae8dd;
--color-travertine-200: #d7d5c6;
--color-travertine-300: #bbb8a7;
--color-travertine-400: #a39f8b;
--color-travertine-500: #8c8770;
--color-travertine-600: #76725f;
--color-travertine-700: #5f5b4c;
--color-travertine-800: #464237;
--color-travertine-900: #302e25;
--color-travertine-950: #1c1b14;
}SCSS
$travertine: #e2ddc7;
$travertine-rgb: 226, 221, 199;
$travertine-light: mix(#fff, $travertine, 20%);
$travertine-dark: mix(#000, $travertine, 20%);
.element {
color: $travertine;
box-shadow: 0 0 0 2px rgba($travertine, 0.35);
}