色名 · #6D4444
Moroccan Leather
Moroccan Leatherは#6D4444:rgb(109 68 68)、hsl(0 23% 35%)、oklch(0.434 0.057 19.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Brown mean? → · Moroccan Leather color name →
#6D4444
oklch(0.434 0.057 19.6)
カラー変換
- HEX
- #6d4444
- RGB
- rgb(109 68 68)
- HSL
- hsl(0 23% 35%)
- HWB
- hwb(0 27% 57%)
- OKLCH
- oklch(0.434 0.057 19.6)
- OKLab
- oklab(0.434 0.054 0.019)
- CIE Lab
- lab(33.77 18.2 7.77)
- LCH
- lch(33.77 19.79 23.1)
- CMYK
- cmyk(0% 38% 38% 57%)
ティント · シェード · トーン
ティント
- 7B5555
- 8A6666
- 987878
- A78A8A
- B59D9C
- C4B0AF
- D2C3C3
- E1D7D7
- F0EBEB
シェード
- 5E3A3A
- 4F3030
- 412626
- 331D1D
- 261414
- 190C0C
- 0D0505
- 040202
- 010000
トーン
- 6F4A4A
- 725050
- 745655
- 765C5B
- 786261
- 7A6867
- 7B6E6D
- 7D7474
- 7F7A7A
カラーハーモニー
補色 +180°
- 6D4444
Moroccan Leather
- 245A5D
≈ Bayberry
類似色 -30° +30°
- 6D4444
Moroccan Leather
- 694455
≈ Finn
- 6B4734
≈ Satin Soil
トライアド +120° +240°
- 6D4444
Moroccan Leather
- 40593A
≈ Ficus
- 3E5170
≈ Blue Flag
スプリットコンプリメンタリー +150° +210°
- 6D4444
Moroccan Leather
- 2D5B4C
≈ Billiard Green
- 2C576A
≈ Deep Loch
テトラード +90° +180° +270°
- 6D4444
Moroccan Leather
- 53542D
≈ Warplock Bronze
- 245A5D
≈ Bayberry
- 504C6E
≈ Harajuku Girl
コントラストとアクセシビリティ
Ag
AAA白の上
WCAG 8.20:1 · APCA Lc 88
Ag
Fail黒の上
WCAG 2.56:1 · APCA Lc 14
最適な文字色: #FFFFFF
WCAG 8.20:1 (AAA) · APCA Lc 88
Contrast pairs
コードスニペット
CSS
:root {
--moroccan-leather: #6d4444;
--moroccan-leather-rgb: 109 68 68;
--moroccan-leather-oklch: oklch(0.434 0.057 19.6);
}
.element {
color: var(--moroccan-leather);
background-color: hsl(0 23% 35%);
border-color: oklch(0.434 0.057 19.6);
}Tailwind CSS v4
@theme {
--color-moroccan-leather: #6d4444;
--color-moroccan-leather-50: #ffefee;
--color-moroccan-leather-100: #fbe1df;
--color-moroccan-leather-200: #eccbc9;
--color-moroccan-leather-300: #d3acaa;
--color-moroccan-leather-400: #be9191;
--color-moroccan-leather-500: #a97777;
--color-moroccan-leather-600: #8f6565;
--color-moroccan-leather-700: #725150;
--color-moroccan-leather-800: #543a3b;
--color-moroccan-leather-900: #3b2828;
--color-moroccan-leather-950: #251616;
}SCSS
$moroccan-leather: #6d4444;
$moroccan-leather-rgb: 109, 68, 68;
$moroccan-leather-light: mix(#fff, $moroccan-leather, 20%);
$moroccan-leather-dark: mix(#000, $moroccan-leather, 20%);
.element {
color: $moroccan-leather;
box-shadow: 0 0 0 2px rgba($moroccan-leather, 0.35);
}