Màu có tên · #BEAECF
Grape’s Treasure
Grape’s Treasure là #BEAECF: rgb(190 174 207), hsl(269 26% 75%), oklch(0.775 0.049 307.1). 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 Purple mean? → · Grape’s Treasure color name →
#BEAECF
oklch(0.775 0.049 307.1)
Chuyển đổi màu
- HEX
- #beaecf
- RGB
- rgb(190 174 207)
- HSL
- hsl(269 26% 75%)
- HWB
- hwb(269 68% 19%)
- OKLCH
- oklch(0.775 0.049 307.1)
- OKLab
- oklab(0.775 0.03 -0.039)
- CIE Lab
- lab(73.27 10.59 -14.63)
- LCH
- lch(73.27 18.06 305.9)
- CMYK
- cmyk(8% 16% 0% 19%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- C4B6D4
- CBBED9
- D1C6DD
- D8CEE2
- DED6E7
- E5DEEC
- EBE6F1
- F2EEF5
- F8F7FA
Sắc đậm
- A597B4
- 8C8099
- 756A7F
- 5E5567
- 48414F
- 332E38
- 1F1C23
- 0D0B10
- 020102
Sắc xám
- B8A9C7
- B1A5BF
- ABA0B7
- A59BAF
- 9E97A7
- 98929F
- 928E97
- 8C898F
- 868588
Hòa sắc
Bổ túc +180°
- BEAECF
Grape’s Treasure
- ADBC9A
≈ Ash Tree
Tương đồng -30° +30°
- BEAECF
Grape’s Treasure
- ADB4D6
≈ Lilac Sachet
- CBAAC1
≈ Winsome Orchid
Bộ ba +120° +240°
- BEAECF
Grape’s Treasure
- CCB095
≈ Gentility
- 92C1BB
≈ Focus Point
Bổ túc chia +150° +210°
- BEAECF
Grape’s Treasure
- BEB693
≈ Bog
- 9DC0A9
≈ Spring Reflection
Bộ bốn +90° +180° +270°
- BEAECF
Grape’s Treasure
- D3ABA0
≈ Everything’s Rosy
- ADBC9A
≈ Ash Tree
- 93BECB
≈ Blue Chalk
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 2.07:1 · APCA Lc 40
Ag
AAATrên nền đen
WCAG 10.14:1 · APCA Lc 62
Màu chữ tốt nhất: #000000
WCAG 10.14:1 (AAA) · APCA Lc 62
Contrast pairs
Đoạn mã
CSS
:root {
--grape-s-treasure: #beaecf;
--grape-s-treasure-rgb: 190 174 207;
--grape-s-treasure-oklch: oklch(0.775 0.049 307.1);
}
.element {
color: var(--grape-s-treasure);
background-color: hsl(269 26% 75%);
border-color: oklch(0.775 0.049 307.1);
}Tailwind CSS v4
@theme {
--color-grape-s-treasure: #beaecf;
--color-grape-s-treasure-50: #f9f2ff;
--color-grape-s-treasure-100: #ede4f5;
--color-grape-s-treasure-200: #dacfe5;
--color-grape-s-treasure-300: #bfb1cb;
--color-grape-s-treasure-400: #a697b6;
--color-grape-s-treasure-500: #8f7ea0;
--color-grape-s-treasure-600: #796b87;
--color-grape-s-treasure-700: #61556c;
--color-grape-s-treasure-800: #463e50;
--color-grape-s-treasure-900: #312b38;
--color-grape-s-treasure-950: #1d1823;
}SCSS
$grape-s-treasure: #beaecf;
$grape-s-treasure-rgb: 190, 174, 207;
$grape-s-treasure-light: mix(#fff, $grape-s-treasure, 20%);
$grape-s-treasure-dark: mix(#000, $grape-s-treasure, 20%);
.element {
color: $grape-s-treasure;
box-shadow: 0 0 0 2px rgba($grape-s-treasure, 0.35);
}