Màu có tên · #D7D4E4
Light Gregorio Garden
Light Gregorio Garden là #D7D4E4: rgb(215 212 228), hsl(251 23% 86%), oklch(0.877 0.022 294.5). 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 Gray mean? → · Light Gregorio Garden color name →
#D7D4E4
oklch(0.877 0.022 294.5)
Chuyển đổi màu
- HEX
- #d7d4e4
- RGB
- rgb(215 212 228)
- HSL
- hsl(251 23% 86%)
- HWB
- hwb(251 83% 11%)
- OKLCH
- oklch(0.877 0.022 294.5)
- OKLab
- oklab(0.877 0.009 -0.02)
- CIE Lab
- lab(85.51 3.28 -7.52)
- LCH
- lch(85.51 8.2 293.5)
- CMYK
- cmyk(6% 7% 0% 11%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- DBD8E7
- DFDCE9
- E3E1EC
- E7E5EF
- EBE9F1
- EFEEF4
- F3F2F7
- F7F6FA
- FBFBFC
Sắc đậm
- BBB8C6
- 9F9DA9
- 85838D
- 6B6972
- 525158
- 3B3A3F
- 252428
- 111012
- 020203
Sắc xám
- CECBDA
- C5C3CF
- BCBAC5
- B3B1BB
- AAA9B1
- A2A1A7
- 99989D
- 919093
- 88888A
Hòa sắc
Bổ túc +180°
- D7D4E4
Light Gregorio Garden
- D6D8C8
≈ September Song
Tương đồng -30° +30°
- D7D4E4
Light Gregorio Garden
- CFD7E6
≈ Monet Lily
- DED2DF
≈ Ametrine Quartz
Bộ ba +120° +240°
- D7D4E4
Light Gregorio Garden
- E3D3C9
≈ Bungalow White
- C9DCD5
≈ Ocean Silk
Bổ túc chia +150° +210°
- D7D4E4
Light Gregorio Garden
- DDD6C7
≈ Canvas Tan
- CEDBCE
≈ Healthy Wealthy and Wise
Bộ bốn +90° +180° +270°
- D7D4E4
Light Gregorio Garden
- E5D1CF
≈ Mauve Chalk
- D6D8C8
≈ September Song
- C7DBDD
≈ Whispering Blue
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.45:1 · APCA Lc 22
Ag
AAATrên nền đen
WCAG 14.42:1 · APCA Lc 82
Màu chữ tốt nhất: #000000
WCAG 14.42:1 (AAA) · APCA Lc 82
Contrast pairs
Đoạn mã
CSS
:root {
--light-gregorio-garden: #d7d4e4;
--light-gregorio-garden-rgb: 215 212 228;
--light-gregorio-garden-oklch: oklch(0.877 0.022 294.5);
}
.element {
color: var(--light-gregorio-garden);
background-color: hsl(251 23% 86%);
border-color: oklch(0.877 0.022 294.5);
}Tailwind CSS v4
@theme {
--color-light-gregorio-garden: #d7d4e4;
--color-light-gregorio-garden-50: #f5f4fb;
--color-light-gregorio-garden-100: #e8e6ef;
--color-light-gregorio-garden-200: #d5d2dd;
--color-light-gregorio-garden-300: #b8b5c2;
--color-light-gregorio-garden-400: #9f9caa;
--color-light-gregorio-garden-500: #878494;
--color-light-gregorio-garden-600: #726f7d;
--color-light-gregorio-garden-700: #5b5964;
--color-light-gregorio-garden-800: #42414a;
--color-light-gregorio-garden-900: #2e2d33;
--color-light-gregorio-garden-950: #1b1a1f;
}SCSS
$light-gregorio-garden: #d7d4e4;
$light-gregorio-garden-rgb: 215, 212, 228;
$light-gregorio-garden-light: mix(#fff, $light-gregorio-garden, 20%);
$light-gregorio-garden-dark: mix(#000, $light-gregorio-garden, 20%);
.element {
color: $light-gregorio-garden;
box-shadow: 0 0 0 2px rgba($light-gregorio-garden, 0.35);
}