Colore con nome · #331166
Candied Blueberry
Candied Blueberry è #331166: rgb(51 17 102), hsl(264 71% 23%), oklch(0.291 0.135 294.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Candied Blueberry color name →
#331166
oklch(0.291 0.135 294.4)
Conversioni di colore
- HEX
- #331166
- RGB
- rgb(51 17 102)
- HSL
- hsl(264 71% 23%)
- HWB
- hwb(264 7% 60%)
- OKLCH
- oklch(0.291 0.135 294.4)
- OKLab
- oklab(0.291 0.056 -0.123)
- CIE Lab
- lab(15.19 32.06 -43.82)
- LCH
- lch(15.19 54.3 306.2)
- CMYK
- cmyk(50% 83% 0% 60%)
Tinte · Ombre · Toni
Tinte
- 432B76
- 554285
- 685995
- 7B6FA4
- 9086B3
- A59DC3
- BBB5D2
- D1CDE1
- E8E6F0
Ombre
- 2B0D58
- 23094A
- 1C063C
- 14042F
- 0D0223
- 070117
- 03000C
- 010004
- 000000
Toni
- 39206A
- 402C6D
- 473770
- 4F4273
- 564C76
- 5E5778
- 66617B
- 6F6B7D
- 77767E
Armonie di colore
Complementare +180°
- 331166
Candied Blueberry
- 2B2F00
≈ Blind Forest
Analogo -30° +30°
- 331166
Candied Blueberry
- 07216D
≈ Abyssal Depths
- 490150
≈ Clairvoyant
Triadico +120° +240°
- 331166
Candied Blueberry
- 461F00
≈ Chocolate Castle
- 00342A
≈ Coach Green
Complementare divisa +150° +210°
- 331166
Candied Blueberry
- 392800
≈ Secret Passage
- 003706
≈ Dark Green
Tetradico +90° +180° +270°
- 331166
Candied Blueberry
- 580009
≈ Saving Light
- 2B2F00
≈ Blind Forest
- 003237
≈ Artist Blue
Contrasto e accessibilità
Ag
AAASu bianco
WCAG 14.86:1 · APCA Lc 101
Ag
FailSu nero
WCAG 1.41:1 · APCA Lc 0
Miglior colore del testo: #FFFFFF
WCAG 14.86:1 (AAA) · APCA Lc 101
Contrast pairs
Frammenti di codice
CSS
:root {
--candied-blueberry: #331166;
--candied-blueberry-rgb: 51 17 102;
--candied-blueberry-oklch: oklch(0.291 0.135 294.4);
}
.element {
color: var(--candied-blueberry);
background-color: hsl(264 71% 23%);
border-color: oklch(0.291 0.135 294.4);
}Tailwind CSS v4
@theme {
--color-candied-blueberry: #331166;
--color-candied-blueberry-50: #f8eeff;
--color-candied-blueberry-100: #ecdfff;
--color-candied-blueberry-200: #d9c9ff;
--color-candied-blueberry-300: #bea9f5;
--color-candied-blueberry-400: #a48de6;
--color-candied-blueberry-500: #8d71d6;
--color-candied-blueberry-600: #7760b4;
--color-candied-blueberry-700: #5f4d91;
--color-candied-blueberry-800: #44386d;
--color-candied-blueberry-900: #2f264d;
--color-candied-blueberry-950: #1c1433;
}SCSS
$candied-blueberry: #331166;
$candied-blueberry-rgb: 51, 17, 102;
$candied-blueberry-light: mix(#fff, $candied-blueberry, 20%);
$candied-blueberry-dark: mix(#000, $candied-blueberry, 20%);
.element {
color: $candied-blueberry;
box-shadow: 0 0 0 2px rgba($candied-blueberry, 0.35);
}