色名 · #D3BEAC
Mushroom Cap
Mushroom Capは#D3BEAC：rgb(211 190 172)、hsl(28 31% 75%)、oklch(0.814 0.034 62.9)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Mushroom Cap color name →
#D3BEAC
oklch(0.814 0.034 62.9)
カラー変換
- HEX
- #d3beac
- RGB
- rgb(211 190 172)
- HSL
- hsl(28 31% 75%)
- HWB
- hwb(28 67% 17%)
- OKLCH
- oklch(0.814 0.034 62.9)
- OKLab
- oklab(0.814 0.016 0.031)
- CIE Lab
- lab(78.41 5.55 11.98)
- LCH
- lch(78.41 13.2 65.1)
- CMYK
- cmyk(0% 10% 18% 17%)
ティント · シェード · トーン
ティント
- D7C4B4
- DCCBBC
- E0D1C4
- E5D8CD
- E9DED5
- EDE5DD
- F2EBE6
- F6F2EE
- FBF8F7
シェード
- B7A595
- 9C8C7F
- 827569
- 695E54
- 514840
- 3A332D
- 241F1B
- 100D0B
- 020201
トーン
- CAB8A8
- C2B1A3
- B9AB9F
- B1A59A
- A99F96
- A09891
- 98928D
- 908C89
- 888684
カラーハーモニー
補色 +180°
- D3BEAC
Mushroom Cap
- B0C5D7
≈ Cloudy Valley
類似色 -30° +30°
- D3BEAC
Mushroom Cap
- D8BBB4
≈ Rose Yoghurt
- CAC2AA
≈ Snake Charmer
トライアド +120° +240°
- D3BEAC
Mushroom Cap
- ABCAC4
≈ Baby Aqua
- C6BDD5
≈ Purpling Dawn
スプリットコンプリメンタリー +150° +210°
- D3BEAC
Mushroom Cap
- AAC9D0
≈ Ocean Eyes
- BBC1D9
≈ Lavender Sachet
テトラード +90° +180° +270°
- D3BEAC
Mushroom Cap
- B2C9B8
≈ Pond’s Edge
- B0C5D7
≈ Cloudy Valley
- D1BACC
≈ Bedazzled
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.79:1 · APCA Lc 33
Ag
AAA黒の上
WCAG 11.73:1 · APCA Lc 70
最適な文字色: #000000
WCAG 11.73:1 (AAA) · APCA Lc 70
Contrast pairs
コードスニペット
CSS
:root {
--mushroom-cap: #d3beac;
--mushroom-cap-rgb: 211 190 172;
--mushroom-cap-oklch: oklch(0.814 0.034 62.9);
}
.element {
color: var(--mushroom-cap);
background-color: hsl(28 31% 75%);
border-color: oklch(0.814 0.034 62.9);
}Tailwind CSS v4
@theme {
--color-mushroom-cap: #d3beac;
--color-mushroom-cap-50: #fcf3eb;
--color-mushroom-cap-100: #f0e6dc;
--color-mushroom-cap-200: #dfd2c5;
--color-mushroom-cap-300: #c4b4a5;
--color-mushroom-cap-400: #ae9a8a;
--color-mushroom-cap-500: #97826f;
--color-mushroom-cap-600: #806e5e;
--color-mushroom-cap-700: #66584b;
--color-mushroom-cap-800: #4b4036;
--color-mushroom-cap-900: #342c25;
--color-mushroom-cap-950: #201914;
}SCSS
$mushroom-cap: #d3beac;
$mushroom-cap-rgb: 211, 190, 172;
$mushroom-cap-light: mix(#fff, $mushroom-cap, 20%);
$mushroom-cap-dark: mix(#000, $mushroom-cap, 20%);
.element {
color: $mushroom-cap;
box-shadow: 0 0 0 2px rgba($mushroom-cap, 0.35);
}