Najbliższy nazwany kolor · #F0EAFD
#F0EAFD
Najbliższy nazwany kolor: Holographic Lavender
#F0EAFD (rgb(240 234 253), hsl(259 83% 95%), oklch(0.947 0.026 300.3)) jest najbliższy nazwanemu kolorowi Holographic Lavender. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#F0EAFD
oklch(0.947 0.026 300.3)
Konwersje koloru
- HEX
- #f0eafd
- RGB
- rgb(240 234 253)
- HSL
- hsl(259 83% 95%)
- HWB
- hwb(259 92% 1%)
- OKLCH
- oklch(0.947 0.026 300.3)
- OKLab
- oklab(0.947 0.013 -0.023)
- CIE Lab
- lab(93.59 4.65 -8.46)
- LCH
- lch(93.59 9.65 298.8)
- CMYK
- cmyk(5% 8% 0% 1%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F1ECFD
- F3EEFD
- F4F0FE
- F6F2FE
- F7F4FE
- F9F7FE
- FAF9FE
- FCFBFF
- FDFDFF
Odcienie ciemniejsze
- D1CBDC
- B2AEBC
- 95919D
- 78757F
- 5D5A62
- 434147
- 2A292D
- 141316
- 030303
Tony
- E4DFF0
- D9D4E3
- CDC9D6
- C2BEC9
- B6B4BD
- ABA9B0
- A09FA4
- 959498
- 8B8A8C
Harmonie kolorów
Komplementarna +180°
- F0EAFD
Holographic Lavender
- EBF1DD
≈ Moth’s Wing
Analogowa -30° +30°
- F0EAFD
Holographic Lavender
- E7EDFF
≈ Brilliant White
- F8E8F6
≈ Cherry Pearl
Triada +120° +240°
- F0EAFD
Holographic Lavender
- FBEADD
≈ Rosarian
- DCF4EE
≈ Aqua Pura
Komplementarna rozszczepiona +150° +210°
- F0EAFD
Holographic Lavender
- F4EDDA
≈ Satin Weave
- E2F3E5
≈ Frosted Mint
Tetrada +90° +180° +270°
- F0EAFD
Holographic Lavender
- FFE8E3
≈ Sheer Rosebud
- EBF1DD
≈ Moth’s Wing
- DBF3F7
≈ Let It Snow
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.17:1 · APCA Lc 8
Ag
AAANa czerni
WCAG 17.89:1 · APCA Lc 96
Najlepszy kolor tekstu: #000000
WCAG 17.89:1 (AAA) · APCA Lc 96
Contrast pairs
Fragmenty kodu
CSS
:root {
--holographic-lavender: #f0eafd;
--holographic-lavender-rgb: 240 234 253;
--holographic-lavender-oklch: oklch(0.947 0.026 300.3);
}
.element {
color: var(--holographic-lavender);
background-color: hsl(259 83% 95%);
border-color: oklch(0.947 0.026 300.3);
}Tailwind CSS v4
@theme {
--color-holographic-lavender: #f0eafd;
--color-holographic-lavender-50: #f6f3fc;
--color-holographic-lavender-100: #e9e6ef;
--color-holographic-lavender-200: #d6d2de;
--color-holographic-lavender-300: #bab4c3;
--color-holographic-lavender-400: #a19bac;
--color-holographic-lavender-500: #898395;
--color-holographic-lavender-600: #746f7e;
--color-holographic-lavender-700: #5c5865;
--color-holographic-lavender-800: #43414a;
--color-holographic-lavender-900: #2e2c34;
--color-holographic-lavender-950: #1b1a1f;
}SCSS
$holographic-lavender: #f0eafd;
$holographic-lavender-rgb: 240, 234, 253;
$holographic-lavender-light: mix(#fff, $holographic-lavender, 20%);
$holographic-lavender-dark: mix(#000, $holographic-lavender, 20%);
.element {
color: $holographic-lavender;
box-shadow: 0 0 0 2px rgba($holographic-lavender, 0.35);
}