Nazwany kolor · #F2E4F5
Minute Mauve
Minute Mauve to #F2E4F5: rgb(242 228 245), hsl(289 46% 93%), oklch(0.935 0.027 320.2). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Minute Mauve color name →
#F2E4F5
oklch(0.935 0.027 320.2)
Konwersje koloru
- HEX
- #f2e4f5
- RGB
- rgb(242 228 245)
- HSL
- hsl(289 46% 93%)
- HWB
- hwb(289 89% 4%)
- OKLCH
- oklch(0.935 0.027 320.2)
- OKLab
- oklab(0.935 0.021 -0.017)
- CIE Lab
- lab(92.09 7.15 -6.49)
- LCH
- lch(92.09 9.65 317.8)
- CMYK
- cmyk(1% 7% 0% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F3E7F6
- F5E9F7
- F6ECF8
- F7EFF9
- F9F1FA
- FAF4FB
- FBF7FC
- FCFAFD
- FEFCFE
Odcienie ciemniejsze
- D2C6D5
- B4A9B6
- 968D98
- 79727B
- 5E585F
- 433F44
- 2B282B
- 141215
- 030303
Tony
- E6DAE9
- DACFDD
- CEC5D0
- C3BBC5
- B7B1B9
- ACA7AD
- A19DA2
- 969396
- 8B8A8B
Harmonie kolorów
Komplementarna +180°
- F2E4F5
Minute Mauve
- E0EEDD
≈ Hill Giant
Analogowa -30° +30°
- F2E4F5
Minute Mauve
- E9E7FB
≈ Cyber Lavender
- F9E3EC
≈ Petal Poise
Triada +120° +240°
- F2E4F5
Minute Mauve
- F3E8D6
≈ Grey Linnet Egg
- D6EFF1
≈ Lakeside Mist
Komplementarna rozszczepiona +150° +210°
- F2E4F5
Minute Mauve
- EAEBD7
≈ Pale Rebelka Jakub
- D9F0E7
≈ Banshee
Tetrada +90° +180° +270°
- F2E4F5
Minute Mauve
- F9E5DA
≈ White Peach
- E0EEDD
≈ Hill Giant
- D8EDF8
≈ Ice Castle
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.22:1 · APCA Lc 11
Ag
AAANa czerni
WCAG 17.19:1 · APCA Lc 93
Najlepszy kolor tekstu: #000000
WCAG 17.19:1 (AAA) · APCA Lc 93
Contrast pairs
Fragmenty kodu
CSS
:root {
--minute-mauve: #f2e4f5;
--minute-mauve-rgb: 242 228 245;
--minute-mauve-oklch: oklch(0.935 0.027 320.2);
}
.element {
color: var(--minute-mauve);
background-color: hsl(289 46% 93%);
border-color: oklch(0.935 0.027 320.2);
}Tailwind CSS v4
@theme {
--color-minute-mauve: #f2e4f5;
--color-minute-mauve-50: #f9f3fa;
--color-minute-mauve-100: #ece5ed;
--color-minute-mauve-200: #dad1db;
--color-minute-mauve-300: #beb3c0;
--color-minute-mauve-400: #a69aa9;
--color-minute-mauve-500: #8f8192;
--color-minute-mauve-600: #796d7b;
--color-minute-mauve-700: #605763;
--color-minute-mauve-800: #464049;
--color-minute-mauve-900: #312c32;
--color-minute-mauve-950: #1d191e;
}SCSS
$minute-mauve: #f2e4f5;
$minute-mauve-rgb: 242, 228, 245;
$minute-mauve-light: mix(#fff, $minute-mauve, 20%);
$minute-mauve-dark: mix(#000, $minute-mauve, 20%);
.element {
color: $minute-mauve;
box-shadow: 0 0 0 2px rgba($minute-mauve, 0.35);
}