이름 색상 · #F4F4E8

Moon Rise

Moon Rise은(는) #F4F4E8: rgb(244 244 232), hsl(60 35% 93%), oklch(0.964 0.016 106.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Gray mean? → · Moon Rise color name →

#F4F4E8

oklch(0.964 0.016 106.7)

색상 변환

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%)

틴트 · 셰이드 · 톤

틴트

F5F5EA
F6F6ED
F7F7EF
F8F8F1
F9FAF3
FBFBF6
FCFCF8
FDFDFA
FEFEFD

셰이드

D4D4CA
B5B5AC
979790
7A7A74
5E5E59
444440
2B2B29
141413
030303

톤

E8E8DD
DCDCD2
D0D0C8
C4C4BD
B8B8B3
ADADA8
A1A19E
969694
8B8B8A

색 조화

보색 +180°

F4F4E8
Moon Rise
F2F2FE
≈ Cloud Break

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

사각 배색 +90° +180° +270°

대비 및 접근성

흰색 위

WCAG 1.10:1 · APCA Lc 0

Fail

검은색 위

WCAG 18.95:1 · APCA Lc 100

AAA

가장 좋은 글자색: #000000

WCAG 18.95:1 (AAA) · APCA Lc 100

Contrast pairs

코드 스니펫

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);
}

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

피커 조합 대비 검사기 Studio JSON API