Nazwany kolor · #F4F4E8
Moon Rise
Moon Rise to #F4F4E8: rgb(244 244 232), hsl(60 35% 93%), oklch(0.964 0.016 106.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Moon Rise color name →
#F4F4E8
oklch(0.964 0.016 106.7)
Konwersje koloru
- HEX
- #f4f4e8
- RGB
- rgb(244 244 232)
- HSL
- hsl(60 35% 93%)
- HWB
- hwb(60 91% 4%)
- OKLCH
- oklch(0.964 0.016 106.7)
- OKLab
- oklab(0.964 -0.005 0.015)
- CIE Lab
- lab(95.94 -1.54 5.8)
- LCH
- lch(95.94 6 104.9)
- CMYK
- cmyk(0% 0% 5% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F5F5EA
- F6F6ED
- F7F7EF
- F8F8F1
- F9FAF3
- FBFBF6
- FCFCF8
- FDFDFA
- FEFEFD
Odcienie ciemniejsze
- D4D4CA
- B5B5AC
- 979790
- 7A7A74
- 5E5E59
- 444440
- 2B2B29
- 141413
- 030303
Tony
- E8E8DD
- DCDCD2
- D0D0C8
- C4C4BD
- B8B8B3
- ADADA8
- A1A19E
- 969694
- 8B8B8A
Harmonie kolorów
Komplementarna +180°
- F4F4E8
Moon Rise
- F2F2FE
≈ Cloud Break
Analogowa -30° +30°
- F4F4E8
Moon Rise
- F9F2E8
≈ Powdered
- EEF6EB
≈ Verde Pastel
Triada +120° +240°
- F4F4E8
Moon Rise
- E9F6FB
≈ Clear Skies
- FCEFF5
≈ Pale Cherry Blossom
Komplementarna rozszczepiona +150° +210°
- F4F4E8
Moon Rise
- ECF4FE
≈ Placebo Blue
- F7F0FA
≈ Cloud Break
Tetrada +90° +180° +270°
- F4F4E8
Moon Rise
- E8F7F7
≈ Indigo White
- F2F2FE
≈ Cloud Break
- FEEFEF
≈ White Gloss
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.10:1 · APCA Lc 0
Ag
AAANa czerni
WCAG 18.95:1 · APCA Lc 100
Najlepszy kolor tekstu: #000000
WCAG 18.95:1 (AAA) · APCA Lc 100
Contrast pairs
Fragmenty kodu
CSS
:root {
--moon-rise: #f4f4e8;
--moon-rise-rgb: 244 244 232;
--moon-rise-oklch: oklch(0.964 0.016 106.7);
}
.element {
color: var(--moon-rise);
background-color: hsl(60 35% 93%);
border-color: oklch(0.964 0.016 106.7);
}Tailwind CSS v4
@theme {
--color-moon-rise: #f4f4e8;
--color-moon-rise-50: #f5f5f0;
--color-moon-rise-100: #e8e8e2;
--color-moon-rise-200: #d4d5cd;
--color-moon-rise-300: #b8b8af;
--color-moon-rise-400: #9f9f95;
--color-moon-rise-500: #87877b;
--color-moon-rise-600: #727268;
--color-moon-rise-700: #5b5b53;
--color-moon-rise-800: #43433d;
--color-moon-rise-900: #2e2e2a;
--color-moon-rise-950: #1b1b17;
}SCSS
$moon-rise: #f4f4e8;
$moon-rise-rgb: 244, 244, 232;
$moon-rise-light: mix(#fff, $moon-rise, 20%);
$moon-rise-dark: mix(#000, $moon-rise, 20%);
.element {
color: $moon-rise;
box-shadow: 0 0 0 2px rgba($moon-rise, 0.35);
}