色名 · #A57C7A
Cherry Mocha
Cherry Mochaは#A57C7A：rgb(165 124 122)、hsl(3 19% 56%)、oklch(0.626 0.051 21.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Red mean? → · Cherry Mocha color name →
#A57C7A
oklch(0.626 0.051 21.8)
カラー変換
- HEX
- #a57c7a
- RGB
- rgb(165 124 122)
- HSL
- hsl(3 19% 56%)
- HWB
- hwb(3 48% 35%)
- OKLCH
- oklch(0.626 0.051 21.8)
- OKLab
- oklab(0.626 0.048 0.019)
- CIE Lab
- lab(56.09 16.2 7.62)
- LCH
- lch(56.09 17.9 25.2)
- CMYK
- cmyk(0% 25% 26% 35%)
ティント · シェード · トーン
ティント
- AE8886
- B79593
- C0A2A0
- C9AFAD
- D2BCBA
- DBC9C8
- E4D6D5
- EDE4E3
- F6F1F1
シェード
- 8F6B69
- 795A59
- 654A49
- 513B3A
- 3D2C2B
- 2B1E1D
- 1A1110
- 0A0505
- 010101
トーン
- A17D7B
- 9E7D7B
- 9A7D7C
- 977E7C
- 937E7D
- 8F7F7E
- 8C7F7E
- 887F7F
- 84807F
カラーハーモニー
補色 +180°
- A57C7A
Cherry Mocha
- 629295
≈ Pauley
類似色 -30° +30°
- A57C7A
Cherry Mocha
- A17B8B
≈ Dusky Orchid
- A2806C
≈ Red Earth
トライアド +120° +240°
- A57C7A
Cherry Mocha
- 779073
≈ Loden Frost
- 7789A8
≈ Ship Cove
スプリットコンプリメンタリー +150° +210°
- A57C7A
Cherry Mocha
- 689284
≈ Pine Ridge
- 688EA2
≈ French Court
テトラード +90° +180° +270°
- A57C7A
Cherry Mocha
- 888B67
≈ Pesto Paste
- 629295
≈ Pauley
- 8883A5
≈ Purple Hills
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.64:1 · APCA Lc 64
Ag
AA黒の上
WCAG 5.76:1 · APCA Lc 38
最適な文字色: #000000
WCAG 5.76:1 (AA) · APCA Lc 38
Contrast pairs
コードスニペット
CSS
:root {
--cherry-mocha: #a57c7a;
--cherry-mocha-rgb: 165 124 122;
--cherry-mocha-oklch: oklch(0.626 0.051 21.8);
}
.element {
color: var(--cherry-mocha);
background-color: hsl(3 19% 56%);
border-color: oklch(0.626 0.051 21.8);
}Tailwind CSS v4
@theme {
--color-cherry-mocha: #a57c7a;
--color-cherry-mocha-50: #fff0ee;
--color-cherry-mocha-100: #f9e2e0;
--color-cherry-mocha-200: #eaccca;
--color-cherry-mocha-300: #d1aeab;
--color-cherry-mocha-400: #bb9391;
--color-cherry-mocha-500: #a67977;
--color-cherry-mocha-600: #8c6765;
--color-cherry-mocha-700: #705250;
--color-cherry-mocha-800: #533b3b;
--color-cherry-mocha-900: #3a2928;
--color-cherry-mocha-950: #241716;
}SCSS
$cherry-mocha: #a57c7a;
$cherry-mocha-rgb: 165, 124, 122;
$cherry-mocha-light: mix(#fff, $cherry-mocha, 20%);
$cherry-mocha-dark: mix(#000, $cherry-mocha, 20%);
.element {
color: $cherry-mocha;
box-shadow: 0 0 0 2px rgba($cherry-mocha, 0.35);
}