이름 색상 · #F0D0B0

Baby Fragrance

Baby Fragrance은(는) #F0D0B0: rgb(240 208 176), hsl(30 68% 82%), oklch(0.877 0.056 67). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Orange mean? → · Baby Fragrance color name →

#F0D0B0

oklch(0.877 0.056 67)

색상 변환

HEX: #f0d0b0
RGB: rgb(240 208 176)
HSL: hsl(30 68% 82%)
HWB: hwb(30 69% 6%)
OKLCH: oklch(0.877 0.056 67)
OKLab: oklab(0.877 0.022 0.051)
CIE Lab: lab(85.62 8.11 20.3)
LCH: lch(85.62 21.86 68.2)
CMYK: cmyk(0% 13% 27% 6%)

틴트 · 셰이드 · 톤

틴트

F2D5B8
F3D9C0
F5DEC8
F6E3D0
F8E8D7
F9ECDF
FBF1E7
FCF6EF
FEFAF7

셰이드

D1B599
B29A82
95806C
786756
5D4F42
43392E
2A231C
14100B
030201

톤

E4C8AB
D9C0A6
CDB7A2
C2AF9D
B7A798
AB9F93
A0978F
96908A
8B8885

색 조화

보색 +180°

F0D0B0
Baby Fragrance
BADBFA
≈ Oh Boy!

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 1.46:1 · APCA Lc 22

Fail

검은색 위

WCAG 14.35:1 · APCA Lc 81

AAA

가장 좋은 글자색: #000000

WCAG 14.35:1 (AAA) · APCA Lc 81

Contrast pairs

코드 스니펫

CSS

:root {
  --baby-fragrance: #f0d0b0;
  --baby-fragrance-rgb: 240 208 176;
  --baby-fragrance-oklch: oklch(0.877 0.056 67);
}

.element {
  color: var(--baby-fragrance);
  background-color: hsl(30 68% 82%);
  border-color: oklch(0.877 0.056 67);
}

Tailwind CSS v4

@theme {
  --color-baby-fragrance: #f0d0b0;
  --color-baby-fragrance-50: #fff3e5;
  --color-baby-fragrance-100: #f5e5d5;
  --color-baby-fragrance-200: #e4d1bb;
  --color-baby-fragrance-300: #cbb399;
  --color-baby-fragrance-400: #b5997c;
  --color-baby-fragrance-500: #a07f5e;
  --color-baby-fragrance-600: #876c50;
  --color-baby-fragrance-700: #6c5640;
  --color-baby-fragrance-800: #503f2e;
  --color-baby-fragrance-900: #382b1f;
  --color-baby-fragrance-950: #22180f;
}

SCSS

$baby-fragrance: #f0d0b0;
$baby-fragrance-rgb: 240, 208, 176;
$baby-fragrance-light: mix(#fff, $baby-fragrance, 20%);
$baby-fragrance-dark: mix(#000, $baby-fragrance, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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