Màu có tên · #EEFFAA
Hawthorn Blossom
Hawthorn Blossom là #EEFFAA: rgb(238 255 170), hsl(72 100% 83%), oklch(0.968 0.109 117.7). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Yellow mean? → · Hawthorn Blossom color name →
#EEFFAA
oklch(0.968 0.109 117.7)
Chuyển đổi màu
- HEX
- #eeffaa
- RGB
- rgb(238 255 170)
- HSL
- hsl(72 100% 83%)
- HWB
- hwb(72 67% 0%)
- OKLCH
- oklch(0.968 0.109 117.7)
- OKLab
- oklab(0.968 -0.051 0.096)
- CIE Lab
- lab(97.29 -15.48 38.73)
- LCH
- lch(97.29 41.71 111.8)
- CMYK
- cmyk(7% 0% 33% 0%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- F0FFB3
- F1FFBC
- F3FFC5
- F5FFCE
- F6FFD6
- F8FFDF
- FAFFE7
- FBFFEF
- FDFFF7
Sắc đậm
- CFDE93
- B1BE7D
- 939E68
- 778053
- 5C633F
- 42482D
- 2A2E1B
- 14160B
- 030301
Sắc xám
- E2F2A6
- D7E5A3
- CCD89F
- C0CB9B
- B5BE97
- AAB192
- 9FA58E
- 959889
- 8A8C85
Hòa sắc
Bổ túc +180°
- EEFFAA
Hawthorn Blossom
- F5F2FF
≈ Cloud Break
Tương đồng -30° +30°
- EEFFAA
Hawthorn Blossom
- FFF4D9
≈ Pastel Moon Creme
- DEFFE1
≈ Frosted Plains
Bộ ba +120° +240°
- EEFFAA
Hawthorn Blossom
- EAF7FF
≈ Clear Skies
- FFF0F4
≈ Lavender Blush
Bổ túc chia +150° +210°
- EEFFAA
Hawthorn Blossom
- F0F4FF
≈ Boysenberry Shadow
- FFEFFE
≈ Lovely Euphoric Delight
Bộ bốn +90° +180° +270°
- EEFFAA
Hawthorn Blossom
- DEFBFF
≈ Matterhorn Snow
- F5F2FF
≈ Cloud Break
- FFF1EF
≈ Polished Pink
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.07:1 · APCA Lc 0
Ag
AAATrên nền đen
WCAG 19.51:1 · APCA Lc 102
Màu chữ tốt nhất: #000000
WCAG 19.51:1 (AAA) · APCA Lc 102
Contrast pairs
Đoạn mã
CSS
:root {
--hawthorn-blossom: #eeffaa;
--hawthorn-blossom-rgb: 238 255 170;
--hawthorn-blossom-oklch: oklch(0.968 0.109 117.7);
}
.element {
color: var(--hawthorn-blossom);
background-color: hsl(72 100% 83%);
border-color: oklch(0.968 0.109 117.7);
}Tailwind CSS v4
@theme {
--color-hawthorn-blossom: #eeffaa;
--color-hawthorn-blossom-50: #f1fad8;
--color-hawthorn-blossom-100: #e3eec5;
--color-hawthorn-blossom-200: #cedca7;
--color-hawthorn-blossom-300: #b0c080;
--color-hawthorn-blossom-400: #99a75a;
--color-hawthorn-blossom-500: #808f31;
--color-hawthorn-blossom-600: #6d792b;
--color-hawthorn-blossom-700: #576122;
--color-hawthorn-blossom-800: #414716;
--color-hawthorn-blossom-900: #2d310e;
--color-hawthorn-blossom-950: #1a1d02;
}SCSS
$hawthorn-blossom: #eeffaa;
$hawthorn-blossom-rgb: 238, 255, 170;
$hawthorn-blossom-light: mix(#fff, $hawthorn-blossom, 20%);
$hawthorn-blossom-dark: mix(#000, $hawthorn-blossom, 20%);
.element {
color: $hawthorn-blossom;
box-shadow: 0 0 0 2px rgba($hawthorn-blossom, 0.35);
}