最も近い色名 · #8B6F5C
#8B6F5C
最も近い色名: Mocha Madness
#8B6F5C（rgb(139 111 92)、hsl(24 20% 45%)、oklch(0.564 0.045 55.8)）に最も近い色名はMocha Madnessです。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
#8B6F5C
oklch(0.564 0.045 55.8)
カラー変換
- HEX
- #8b6f5c
- RGB
- rgb(139 111 92)
- HSL
- hsl(24 20% 45%)
- HWB
- hwb(24 36% 45%)
- OKLCH
- oklch(0.564 0.045 55.8)
- OKLab
- oklab(0.564 0.026 0.038)
- CIE Lab
- lab(49.24 9.3 15.03)
- LCH
- lch(49.24 17.67 58.3)
- CMYK
- cmyk(0% 20% 34% 45%)
ティント · シェード · トーン
ティント
- 967C6B
- A28A7B
- AD988A
- B8A69A
- C4B5AA
- D0C3BB
- DBD2CC
- E7E1DC
- F3F0EE
シェード
- 78604F
- 665142
- 544236
- 43342A
- 32271F
- 231A14
- 140E0A
- 070403
- 010100
トーン
- 8A7160
- 897363
- 887467
- 87766B
- 86786E
- 857972
- 847B75
- 827D79
- 817E7C
カラーハーモニー
補色 +180°
- 8B6F5C
Mocha Madness
- 5C7A8D
≈ Providence
類似色 -30° +30°
- 8B6F5C
Mocha Madness
- 8F6C68
≈ Moss Rose
- 827457
≈ Private Affair
トライアド +120° +240°
- 8B6F5C
Mocha Madness
- 597F74
≈ Trellis Vine
- 77708E
≈ Capercaillie Mauve
スプリットコンプリメンタリー +150° +210°
- 8B6F5C
Mocha Madness
- 557E83
≈ Sultry Bay
- 697591
≈ Legal Eagle
テトラード +90° +180° +270°
- 8B6F5C
Mocha Madness
- 657D66
≈ Stone Cypress Green
- 5C7A8D
≈ Providence
- 846D84
≈ Purple Grey
コントラストとアクセシビリティ
Ag
AA白の上
WCAG 4.63:1 · APCA Lc 72
Ag
AA黒の上
WCAG 4.52:1 · APCA Lc 29
最適な文字色: #FFFFFF
WCAG 4.63:1 (AA) · APCA Lc 72
Contrast pairs
コードスニペット
CSS
:root {
--mocha-madness: #8b6f5c;
--mocha-madness-rgb: 139 111 92;
--mocha-madness-oklch: oklch(0.564 0.045 55.8);
}
.element {
color: var(--mocha-madness);
background-color: hsl(24 20% 45%);
border-color: oklch(0.564 0.045 55.8);
}Tailwind CSS v4
@theme {
--color-mocha-madness: #8b6f5c;
--color-mocha-madness-50: #fff2e9;
--color-mocha-madness-100: #f4e5d9;
--color-mocha-madness-200: #e4d0c2;
--color-mocha-madness-300: #cab2a1;
--color-mocha-madness-400: #b49885;
--color-mocha-madness-500: #9e7f69;
--color-mocha-madness-600: #866b59;
--color-mocha-madness-700: #6b5647;
--color-mocha-madness-800: #4f3e34;
--color-mocha-madness-900: #372b23;
--color-mocha-madness-950: #221812;
}SCSS
$mocha-madness: #8b6f5c;
$mocha-madness-rgb: 139, 111, 92;
$mocha-madness-light: mix(#fff, $mocha-madness, 20%);
$mocha-madness-dark: mix(#000, $mocha-madness, 20%);
.element {
color: $mocha-madness;
box-shadow: 0 0 0 2px rgba($mocha-madness, 0.35);
}