Nazwany kolor · #F4BFFF
Electric Lavender
Electric Lavender to #F4BFFF: rgb(244 191 255), hsl(290 100% 87%), oklch(0.872 0.103 320.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Purple mean? → · Electric Lavender color name →
#F4BFFF
oklch(0.872 0.103 320.5)
Konwersje koloru
- HEX
- #f4bfff
- RGB
- rgb(244 191 255)
- HSL
- hsl(290 100% 87%)
- HWB
- hwb(290 75% 0%)
- OKLCH
- oklch(0.872 0.103 320.5)
- OKLab
- oklab(0.872 0.08 -0.066)
- CIE Lab
- lab(83.73 27.55 -24.12)
- LCH
- lch(83.73 36.62 318.8)
- CMYK
- cmyk(4% 25% 0% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F5C6FF
- F7CCFF
- F8D2FF
- F9D9FF
- FADFFF
- FBE6FF
- FCECFF
- FDF2FF
- FEF9FF
Odcienie ciemniejsze
- D4A6DE
- B58DBE
- 97759E
- 7A5E80
- 5E4863
- 443348
- 2B1F2E
- 140D16
- 030203
Tony
- E8B9F2
- DCB2E5
- D0ACD8
- C4A6CB
- B99FBE
- AD99B1
- A293A5
- 968D98
- 8B868C
Harmonie kolorów
Komplementarna +180°
- F4BFFF
Electric Lavender
- B0E6A6
≈ Appetite
Analogowa -30° +30°
- F4BFFF
Electric Lavender
- D4CEFF
≈ Lavender Blue
- FFC0DC
≈ Cotton Candy
Triada +120° +240°
- F4BFFF
Electric Lavender
- F8CE85
≈ Facemark
- 79EAF0
≈ Dead Sea
Komplementarna rozszczepiona +150° +210°
- F4BFFF
Electric Lavender
- D8DC8B
≈ Wax Green
- 8AEBCB
≈ Bubble Algae
Tetrada +90° +180° +270°
- F4BFFF
Electric Lavender
- FFC7A8
≈ Bright Citrus
- B0E6A6
≈ Appetite
- A0DFFF
≈ Columbia Blue
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.52:1 · APCA Lc 24
Ag
AAANa czerni
WCAG 13.74:1 · APCA Lc 79
Najlepszy kolor tekstu: #000000
WCAG 13.74:1 (AAA) · APCA Lc 79
Contrast pairs
Fragmenty kodu
CSS
:root {
--electric-lavender: #f4bfff;
--electric-lavender-rgb: 244 191 255;
--electric-lavender-oklch: oklch(0.872 0.103 320.5);
}
.element {
color: var(--electric-lavender);
background-color: hsl(290 100% 87%);
border-color: oklch(0.872 0.103 320.5);
}Tailwind CSS v4
@theme {
--color-electric-lavender: #f4bfff;
--color-electric-lavender-50: #ffecff;
--color-electric-lavender-100: #f9ddfd;
--color-electric-lavender-200: #eac6ef;
--color-electric-lavender-300: #d1a6d7;
--color-electric-lavender-400: #ba8ac4;
--color-electric-lavender-500: #a56eb0;
--color-electric-lavender-600: #8b5e95;
--color-electric-lavender-700: #704b77;
--color-electric-lavender-800: #513659;
--color-electric-lavender-900: #39253e;
--color-electric-lavender-950: #231428;
}SCSS
$electric-lavender: #f4bfff;
$electric-lavender-rgb: 244, 191, 255;
$electric-lavender-light: mix(#fff, $electric-lavender, 20%);
$electric-lavender-dark: mix(#000, $electric-lavender, 20%);
.element {
color: $electric-lavender;
box-shadow: 0 0 0 2px rgba($electric-lavender, 0.35);
}