色名 · #60281E
Chestnut Leather
Chestnut Leatherは#60281E：rgb(96 40 30)、hsl(9 52% 25%)、oklch(0.354 0.084 31.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Brown mean? → · Chestnut Leather color name →
#60281E
oklch(0.354 0.084 31.9)
カラー変換
- HEX
- #60281e
- RGB
- rgb(96 40 30)
- HSL
- hsl(9 52% 25%)
- HWB
- hwb(9 12% 62%)
- OKLCH
- oklch(0.354 0.084 31.9)
- OKLab
- oklab(0.354 0.071 0.044)
- CIE Lab
- lab(24.33 25.43 19.45)
- LCH
- lch(24.33 32.01 37.4)
- CMYK
- cmyk(0% 58% 69% 62%)
ティント · シェード · トーン
ティント
- 703C32
- 805046
- 90645B
- A07971
- B08E87
- C0A49E
- D0BAB6
- DFD1CE
- EFE8E6
シェード
- 522119
- 451B13
- 38150E
- 2C0F09
- 200905
- 150403
- 0A0201
- 030100
- 000000
トーン
- 643128
- 683A31
- 6C433B
- 6F4C44
- 73544E
- 765D58
- 796662
- 7B6E6C
- 7E7776
カラーハーモニー
補色 +180°
- 60281E
Chestnut Leather
- 00444E
≈ Crab Nebula
類似色 -30° +30°
- 60281E
Chestnut Leather
- 5E2638
≈ Zinfandel
- 593000
≈ Eyelash Camel
トライアド +120° +240°
- 60281E
Chestnut Leather
- 0D4824
≈ Pine Green
- 2C3767
≈ Blue Depths
スプリットコンプリメンタリー +150° +210°
- 60281E
Chestnut Leather
- 00463E
≈ MSU Green
- 004063
≈ Dark Imperial Blue
テトラード +90° +180° +270°
- 60281E
Chestnut Leather
- 354202
≈ Garden Shadow
- 00444E
≈ Crab Nebula
- 442F60
≈ Violet Indigo
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 11.54:1 · APCA Lc 96
Ag
Fail黒の上
WCAG 1.81:1 · APCA Lc 0
最適な文字色: #FFFFFF
WCAG 11.54:1 (AAA) · APCA Lc 96
Contrast pairs
コードスニペット
CSS
:root {
--chestnut-leather: #60281e;
--chestnut-leather-rgb: 96 40 30;
--chestnut-leather-oklch: oklch(0.354 0.084 31.9);
}
.element {
color: var(--chestnut-leather);
background-color: hsl(9 52% 25%);
border-color: oklch(0.354 0.084 31.9);
}Tailwind CSS v4
@theme {
--color-chestnut-leather: #60281e;
--color-chestnut-leather-50: #ffede6;
--color-chestnut-leather-100: #ffdfd6;
--color-chestnut-leather-200: #f6c8bd;
--color-chestnut-leather-300: #dfa89b;
--color-chestnut-leather-400: #cb8c7f;
--color-chestnut-leather-500: #b77163;
--color-chestnut-leather-600: #9b6054;
--color-chestnut-leather-700: #7c4c43;
--color-chestnut-leather-800: #5c3731;
--color-chestnut-leather-900: #412621;
--color-chestnut-leather-950: #291411;
}SCSS
$chestnut-leather: #60281e;
$chestnut-leather-rgb: 96, 40, 30;
$chestnut-leather-light: mix(#fff, $chestnut-leather, 20%);
$chestnut-leather-dark: mix(#000, $chestnut-leather, 20%);
.element {
color: $chestnut-leather;
box-shadow: 0 0 0 2px rgba($chestnut-leather, 0.35);
}