Nazwany kolor · #CC66DD
Blueberry Glaze
Blueberry Glaze to #CC66DD: rgb(204 102 221), hsl(291 64% 63%), oklch(0.675 0.195 321.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Blueberry Glaze color name →
#CC66DD
oklch(0.675 0.195 321.7)
Konwersje koloru
- HEX
- #cc66dd
- RGB
- rgb(204 102 221)
- HSL
- hsl(291 64% 63%)
- HWB
- hwb(291 40% 13%)
- OKLCH
- oklch(0.675 0.195 321.7)
- OKLab
- oklab(0.675 0.153 -0.121)
- CIE Lab
- lab(59.29 53.86 -43.58)
- LCH
- lch(59.29 69.28 321)
- CMYK
- cmyk(8% 54% 0% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D277E1
- D887E5
- DD97E9
- E3A6ED
- E8B5F0
- EDC4F3
- F2D3F7
- F6E1FA
- FBF0FC
Odcienie ciemniejsze
- B158C0
- 974AA4
- 7E3C88
- 652F6E
- 4E2355
- 37173D
- 220C26
- 0F0411
- 020002
Tony
- C56AD4
- BD6ECB
- B672C1
- AF75B8
- A777AF
- A079A6
- 987B9C
- 907D93
- 887F8A
Harmonie kolorów
Komplementarna +180°
- CC66DD
Blueberry Glaze
- 3FB332
≈ Try Your Luck
Analogowa -30° +30°
- CC66DD
Blueberry Glaze
- 9B7BFF
≈ Forgotten Purple
- EB58A4
≈ Tutuji Pink
Triada +120° +240°
- CC66DD
Blueberry Glaze
- C18C00
≈ Moutarde de Bénichon
- 00ABB5
≈ Bluebird
Komplementarna rozszczepiona +150° +210°
- CC66DD
Blueberry Glaze
- 9A9F00
≈ Forest Lichen
- 00B08D
≈ Victorian Greenhouse
Tetrada +90° +180° +270°
- CC66DD
Blueberry Glaze
- E77100
≈ Thai Mango
- 3FB332
≈ Try Your Luck
- 00A4DC
≈ Vanadyl Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.22:1 · APCA Lc 59
Ag
AANa czerni
WCAG 6.51:1 · APCA Lc 43
Najlepszy kolor tekstu: #000000
WCAG 6.51:1 (AA) · APCA Lc 43
Contrast pairs
Fragmenty kodu
CSS
:root {
--blueberry-glaze: #cc66dd;
--blueberry-glaze-rgb: 204 102 221;
--blueberry-glaze-oklch: oklch(0.675 0.195 321.7);
}
.element {
color: var(--blueberry-glaze);
background-color: hsl(291 64% 63%);
border-color: oklch(0.675 0.195 321.7);
}Tailwind CSS v4
@theme {
--color-blueberry-glaze: #cc66dd;
--color-blueberry-glaze-50: #ffe3ff;
--color-blueberry-glaze-100: #ffd2ff;
--color-blueberry-glaze-200: #fdb7ff;
--color-blueberry-glaze-300: #e793f0;
--color-blueberry-glaze-400: #d271e2;
--color-blueberry-glaze-500: #be4cd1;
--color-blueberry-glaze-600: #a142b1;
--color-blueberry-glaze-700: #81358e;
--color-blueberry-glaze-800: #5e256b;
--color-blueberry-glaze-900: #42194c;
--color-blueberry-glaze-950: #2a0932;
}SCSS
$blueberry-glaze: #cc66dd;
$blueberry-glaze-rgb: 204, 102, 221;
$blueberry-glaze-light: mix(#fff, $blueberry-glaze, 20%);
$blueberry-glaze-dark: mix(#000, $blueberry-glaze, 20%);
.element {
color: $blueberry-glaze;
box-shadow: 0 0 0 2px rgba($blueberry-glaze, 0.35);
}