이름 색상 · #D5E5E7

Lauren’s Surprise

Lauren’s Surprise은(는) #D5E5E7: rgb(213 229 231), hsl(187 27% 87%), oklch(0.911 0.017 205.8). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Gray mean? → · Lauren’s Surprise color name →

#D5E5E7

oklch(0.911 0.017 205.8)

색상 변환

HEX: #d5e5e7
RGB: rgb(213 229 231)
HSL: hsl(187 27% 87%)
HWB: hwb(187 84% 9%)
OKLCH: oklch(0.911 0.017 205.8)
OKLab: oklab(0.911 -0.016 -0.008)
CIE Lab: lab(89.78 -5.23 -2.91)
LCH: lch(89.78 5.98 209.1)
CMYK: cmyk(8% 1% 0% 9%)

틴트 · 셰이드 · 톤

틴트

D9E8E9
DDEAEC
E2EDEE
E6EFF1
EAF2F3
EEF5F5
F2F7F8
F7FAFA
FBFCFD

셰이드

B9C7C9
9EAAAB
838E8F
6A7273
515859
3A3F40
242828
101213
020303

톤

CCDADC
C3D0D2
BBC6C7
B2BBBC
AAB1B2
A1A7A8
999D9E
909394
888A8A

색 조화

보색 +180°

D5E5E7
Lauren’s Surprise
EDDDDB
≈ St. Nicholas Beard

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 1.29:1 · APCA Lc 15

Fail

검은색 위

WCAG 16.19:1 · APCA Lc 89

AAA

가장 좋은 글자색: #000000

WCAG 16.19:1 (AAA) · APCA Lc 89

Contrast pairs

코드 스니펫

CSS

:root {
  --lauren-s-surprise: #d5e5e7;
  --lauren-s-surprise-rgb: 213 229 231;
  --lauren-s-surprise-oklch: oklch(0.911 0.017 205.8);
}

.element {
  color: var(--lauren-s-surprise);
  background-color: hsl(187 27% 87%);
  border-color: oklch(0.911 0.017 205.8);
}

Tailwind CSS v4

@theme {
  --color-lauren-s-surprise: #d5e5e7;
  --color-lauren-s-surprise-50: #f0f7f8;
  --color-lauren-s-surprise-100: #e2eaeb;
  --color-lauren-s-surprise-200: #ccd6d8;
  --color-lauren-s-surprise-300: #aebabc;
  --color-lauren-s-surprise-400: #93a2a3;
  --color-lauren-s-surprise-500: #7a8a8c;
  --color-lauren-s-surprise-600: #677476;
  --color-lauren-s-surprise-700: #525d5f;
  --color-lauren-s-surprise-800: #3c4445;
  --color-lauren-s-surprise-900: #292f30;
  --color-lauren-s-surprise-950: #171c1c;
}

SCSS

$lauren-s-surprise: #d5e5e7;
$lauren-s-surprise-rgb: 213, 229, 231;
$lauren-s-surprise-light: mix(#fff, $lauren-s-surprise, 20%);
$lauren-s-surprise-dark: mix(#000, $lauren-s-surprise, 20%);

.element {
  color: $lauren-s-surprise;
  box-shadow: 0 0 0 2px rgba($lauren-s-surprise, 0.35);
}

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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