色名 · #E1C38B
Moonlight Yellow
Moonlight Yellowは#E1C38B：rgb(225 195 139)、hsl(39 59% 71%)、oklch(0.83 0.08 82.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Orange mean? → · Moonlight Yellow color name →
#E1C38B
oklch(0.83 0.08 82.7)
カラー変換
- HEX
- #e1c38b
- RGB
- rgb(225 195 139)
- HSL
- hsl(39 59% 71%)
- HWB
- hwb(39 55% 12%)
- OKLCH
- oklch(0.83 0.08 82.7)
- OKLab
- oklab(0.83 0.01 0.08)
- CIE Lab
- lab(80.43 5.33 32.31)
- LCH
- lch(80.43 32.75 80.6)
- CMYK
- cmyk(0% 13% 38% 12%)
ティント · シェード · トーン
ティント
- E4C997
- E7CFA3
- EAD5AE
- EDDBBA
- F0E1C5
- F3E7D1
- F6EDDC
- F9F3E8
- FCF9F3
シェード
- C4A978
- A79066
- 8B7854
- 706043
- 564A32
- 3E3423
- 272014
- 120E07
- 020201
トーン
- D7BC8A
- CDB58A
- C3AF89
- B9A888
- AFA187
- A69A86
- 9C9485
- 938D83
- 898782
カラーハーモニー
補色 +180°
- E1C38B
Moonlight Yellow
- ACC8FC
≈ Night Snow
類似色 -30° +30°
- E1C38B
Moonlight Yellow
- F2B997
≈ Peach Parfait
- C7CD91
≈ Dancing Green
トライアド +120° +240°
- E1C38B
Moonlight Yellow
- 86D7DE
≈ VIC 20 Sky
- E1B6E6
≈ Pretty Petunia
スプリットコンプリメンタリー +150° +210°
- E1C38B
Moonlight Yellow
- 92D1F3
≈ Slightly Spritzig
- C8BEF8
≈ Connecticut Lilac
テトラード +90° +180° +270°
- E1C38B
Moonlight Yellow
- 8FD9C2
≈ Chloride
- ACC8FC
≈ Night Snow
- F1B2CC
≈ Fairy Tale
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.69:1 · APCA Lc 30
Ag
AAA黒の上
WCAG 12.38:1 · APCA Lc 73
最適な文字色: #000000
WCAG 12.38:1 (AAA) · APCA Lc 73
Contrast pairs
コードスニペット
CSS
:root {
--moonlight-yellow: #e1c38b;
--moonlight-yellow-rgb: 225 195 139;
--moonlight-yellow-oklch: oklch(0.83 0.08 82.7);
}
.element {
color: var(--moonlight-yellow);
background-color: hsl(39 59% 71%);
border-color: oklch(0.83 0.08 82.7);
}Tailwind CSS v4
@theme {
--color-moonlight-yellow: #e1c38b;
--color-moonlight-yellow-50: #fff4dc;
--color-moonlight-yellow-100: #f4e6ca;
--color-moonlight-yellow-200: #e4d2ae;
--color-moonlight-yellow-300: #cbb588;
--color-moonlight-yellow-400: #b69a67;
--color-moonlight-yellow-500: #a08144;
--color-moonlight-yellow-600: #876d3b;
--color-moonlight-yellow-700: #6d572e;
--color-moonlight-yellow-800: #513f20;
--color-moonlight-yellow-900: #382c15;
--color-moonlight-yellow-950: #231907;
}SCSS
$moonlight-yellow: #e1c38b;
$moonlight-yellow-rgb: 225, 195, 139;
$moonlight-yellow-light: mix(#fff, $moonlight-yellow, 20%);
$moonlight-yellow-dark: mix(#000, $moonlight-yellow, 20%);
.element {
color: $moonlight-yellow;
box-shadow: 0 0 0 2px rgba($moonlight-yellow, 0.35);
}