色名 · #76563E
Leather & Lace
Leather & Laceは#76563E：rgb(118 86 62)、hsl(26 31% 35%)、oklch(0.481 0.056 57.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Brown mean? → · Leather & Lace color name →
#76563E
oklch(0.481 0.056 57.8)
カラー変換
- HEX
- #76563e
- RGB
- rgb(118 86 62)
- HSL
- hsl(26 31% 35%)
- HWB
- hwb(26 24% 54%)
- OKLCH
- oklch(0.481 0.056 57.8)
- OKLab
- oklab(0.481 0.03 0.047)
- CIE Lab
- lab(39.57 11.3 19.43)
- LCH
- lch(39.57 22.48 59.8)
- CMYK
- cmyk(0% 27% 47% 54%)
ティント · シェード · トーン
ティント
- 836650
- 917562
- 9E8674
- AB9687
- B9A79A
- C7B8AE
- D5C9C1
- E3DBD6
- F1EDEA
シェード
- 664A35
- 563E2B
- 473223
- 38271A
- 291C12
- 1C120A
- 0F0804
- 050201
- 010000
トーン
- 775A45
- 785E4B
- 7A6352
- 7B6759
- 7C6B5F
- 7D6F66
- 7E736C
- 7E7873
- 7F7C79
カラーハーモニー
補色 +180°
- 76563E
Leather & Lace
- 3F637A
≈ Mallard Blue
類似色 -30° +30°
- 76563E
Leather & Lace
- 7A524C
≈ Vandyck Brown
- 6B5C38
≈ Plum Green
トライアド +120° +240°
- 76563E
Leather & Lace
- 38685E
≈ Seiheki Green
- 61577A
≈ Taylor
スプリットコンプリメンタリー +150° +210°
- 76563E
Leather & Lace
- 34676E
≈ Smock Blue
- 505D7E
≈ Coastal Fjord
テトラード +90° +180° +270°
- 76563E
Leather & Lace
- 48674C
≈ Green Perennial
- 3F637A
≈ Mallard Blue
- 6F536E
≈ Basil Mauve
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 6.62:1 · APCA Lc 83
Ag
Fail黒の上
WCAG 3.17:1 · APCA Lc 19
最適な文字色: #FFFFFF
WCAG 6.62:1 (AA) · APCA Lc 83
Contrast pairs
コードスニペット
CSS
:root {
--leather-lace: #76563e;
--leather-lace-rgb: 118 86 62;
--leather-lace-oklch: oklch(0.481 0.056 57.8);
}
.element {
color: var(--leather-lace);
background-color: hsl(26 31% 35%);
border-color: oklch(0.481 0.056 57.8);
}Tailwind CSS v4
@theme {
--color-leather-lace: #76563e;
--color-leather-lace-50: #fff2e6;
--color-leather-lace-100: #f7e4d6;
--color-leather-lace-200: #e7cfbd;
--color-leather-lace-300: #ceb19b;
--color-leather-lace-400: #b8977e;
--color-leather-lace-500: #a37d61;
--color-leather-lace-600: #8a6a53;
--color-leather-lace-700: #6e5542;
--color-leather-lace-800: #523d30;
--color-leather-lace-900: #392a20;
--color-leather-lace-950: #231810;
}SCSS
$leather-lace: #76563e;
$leather-lace-rgb: 118, 86, 62;
$leather-lace-light: mix(#fff, $leather-lace, 20%);
$leather-lace-dark: mix(#000, $leather-lace, 20%);
.element {
color: $leather-lace;
box-shadow: 0 0 0 2px rgba($leather-lace, 0.35);
}