色名 · #EFE2D9
Merlin’s Beard
Merlin’s Beardは#EFE2D9：rgb(239 226 217)、hsl(25 41% 89%)、oklch(0.921 0.019 57.2)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Gray mean? → · Merlin’s Beard color name →
#EFE2D9
oklch(0.921 0.019 57.2)
カラー変換
- HEX
- #efe2d9
- RGB
- rgb(239 226 217)
- HSL
- hsl(25 41% 89%)
- HWB
- hwb(25 85% 6%)
- OKLCH
- oklch(0.921 0.019 57.2)
- OKLab
- oklab(0.921 0.01 0.016)
- CIE Lab
- lab(90.75 3.46 6.08)
- LCH
- lch(90.75 7 60.4)
- CMYK
- cmyk(0% 5% 9% 6%)
ティント · シェード · トーン
ティント
- F1E5DD
- F2E8E1
- F4EBE4
- F5EEE8
- F7F0EC
- F9F3F0
- FAF6F4
- FCF9F7
- FDFCFB
シェード
- D0C4BC
- B1A8A1
- 948C86
- 78716C
- 5C5753
- 423E3B
- 2A2725
- 141211
- 030302
トーン
- E3D8D0
- D8CEC7
- CCC4BD
- C1BAB4
- B6B0AB
- ABA6A3
- A09C9A
- 959391
- 8B8989
カラーハーモニー
補色 +180°
- EFE2D9
Merlin’s Beard
- DAE7F0
≈ Space Wolves Grey
類似色 -30° +30°
- EFE2D9
Merlin’s Beard
- F1E0DE
≈ New Youth
- EAE4D7
≈ Dry Sand
トライアド +120° +240°
- EFE2D9
Merlin’s Beard
- D8E9E4
≈ Snowball Effect
- E6E2F0
≈ Farsighted
スプリットコンプリメンタリー +150° +210°
- EFE2D9
Merlin’s Beard
- D7E9EB
≈ Boiling Point
- DFE5F2
≈ Crystal Falls
テトラード +90° +180° +270°
- EFE2D9
Merlin’s Beard
- DDE8DE
≈ Minified Green
- DAE7F0
≈ Space Wolves Grey
- ECE1EB
≈ Heaven Sent
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.26:1 · APCA Lc 13
Ag
AAA黒の上
WCAG 16.55:1 · APCA Lc 91
最適な文字色: #000000
WCAG 16.55:1 (AAA) · APCA Lc 91
Contrast pairs
コードスニペット
CSS
:root {
--merlin-s-beard: #efe2d9;
--merlin-s-beard-rgb: 239 226 217;
--merlin-s-beard-oklch: oklch(0.921 0.019 57.2);
}
.element {
color: var(--merlin-s-beard);
background-color: hsl(25 41% 89%);
border-color: oklch(0.921 0.019 57.2);
}Tailwind CSS v4
@theme {
--color-merlin-s-beard: #efe2d9;
--color-merlin-s-beard-50: #f9f4f0;
--color-merlin-s-beard-100: #ede6e2;
--color-merlin-s-beard-200: #dbd2cc;
--color-merlin-s-beard-300: #bfb5ae;
--color-merlin-s-beard-400: #a79c94;
--color-merlin-s-beard-500: #90837a;
--color-merlin-s-beard-600: #7a6f68;
--color-merlin-s-beard-700: #625953;
--color-merlin-s-beard-800: #48413c;
--color-merlin-s-beard-900: #322d29;
--color-merlin-s-beard-950: #1e1a17;
}SCSS
$merlin-s-beard: #efe2d9;
$merlin-s-beard-rgb: 239, 226, 217;
$merlin-s-beard-light: mix(#fff, $merlin-s-beard, 20%);
$merlin-s-beard-dark: mix(#000, $merlin-s-beard, 20%);
.element {
color: $merlin-s-beard;
box-shadow: 0 0 0 2px rgba($merlin-s-beard, 0.35);
}