이름 색상 · #F4C0C6

Rose Reminder

Rose Reminder은(는) #F4C0C6: rgb(244 192 198), hsl(353 70% 85%), oklch(0.856 0.06 10.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Pink mean? → · Rose Reminder color name →

#F4C0C6

oklch(0.856 0.06 10.7)

색상 변환

HEX: #f4c0c6
RGB: rgb(244 192 198)
HSL: hsl(353 70% 85%)
HWB: hwb(353 75% 4%)
OKLCH: oklch(0.856 0.06 10.7)
OKLab: oklab(0.856 0.059 0.011)
CIE Lab: lab(82.56 19.84 4.49)
LCH: lch(82.56 20.35 12.8)
CMYK: cmyk(0% 21% 19% 4%)

틴트 · 셰이드 · 톤

틴트

F5C6CC
F7CDD1
F8D3D7
F9D9DC
FADFE2
FCE6E8
FDECEE
FDF2F3
FEF9F9

셰이드

D4A7AC
B58E92
97767A
7A5F62
5E494B
443435
2B2021
140E0E
030202

톤

E8B9BF
DCB3B8
D0ADB0
C5A6A9
B9A0A2
AD999B
A29394
978D8E
8B8687

색 조화

보색 +180°

F4C0C6
Rose Reminder
A2DDD9
≈ Aqua Spray

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 1.59:1 · APCA Lc 27

Fail

검은색 위

WCAG 13.20:1 · APCA Lc 76

AAA

가장 좋은 글자색: #000000

WCAG 13.20:1 (AAA) · APCA Lc 76

Contrast pairs

코드 스니펫

CSS

:root {
  --rose-reminder: #f4c0c6;
  --rose-reminder-rgb: 244 192 198;
  --rose-reminder-oklch: oklch(0.856 0.06 10.7);
}

.element {
  color: var(--rose-reminder);
  background-color: hsl(353 70% 85%);
  border-color: oklch(0.856 0.06 10.7);
}

Tailwind CSS v4

@theme {
  --color-rose-reminder: #f4c0c6;
  --color-rose-reminder-50: #ffeff0;
  --color-rose-reminder-100: #fbe0e2;
  --color-rose-reminder-200: #edcacd;
  --color-rose-reminder-300: #d4abaf;
  --color-rose-reminder-400: #bf9096;
  --color-rose-reminder-500: #aa767c;
  --color-rose-reminder-600: #906469;
  --color-rose-reminder-700: #735054;
  --color-rose-reminder-800: #553a3e;
  --color-rose-reminder-900: #3b282b;
  --color-rose-reminder-950: #251618;
}

SCSS

$rose-reminder: #f4c0c6;
$rose-reminder-rgb: 244, 192, 198;
$rose-reminder-light: mix(#fff, $rose-reminder, 20%);
$rose-reminder-dark: mix(#000, $rose-reminder, 20%);

.element {
  color: $rose-reminder;
  box-shadow: 0 0 0 2px rgba($rose-reminder, 0.35);
}

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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