이름 색상 · #7C787B

Cinder Fox

Cinder Fox은(는) #7C787B: rgb(124 120 123), hsl(315 2% 48%), oklch(0.577 0.007 334.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Gray mean? → · Cinder Fox color name →

#7C787B

oklch(0.577 0.007 334.1)

색상 변환

HEX: #7c787b
RGB: rgb(124 120 123)
HSL: hsl(315 2% 48%)
HWB: hwb(315 47% 51%)
OKLCH: oklch(0.577 0.007 334.1)
OKLab: oklab(0.577 0.006 -0.003)
CIE Lab: lab(50.86 2.02 -1.08)
LCH: lch(50.86 2.29 331.9)
CMYK: cmyk(0% 3% 1% 51%)

틴트 · 셰이드 · 톤

틴트

888587
959194
A19FA1
AEACAE
BBB9BB
C9C7C8
D6D5D6
E3E3E3
F1F1F1

셰이드

6B676A
5A575A
4A484A
3B393A
2C2A2C
1E1D1E
111010
050505
010101

톤

7C797B
7D7A7C
7D7A7C
7E7B7D
7E7C7D
7E7D7E
7F7E7E
7F7E7F
807F7F

색 조화

보색 +180°

7C787B
Cinder Fox
777B78
≈ Legendary Grey

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 4.34:1 · APCA Lc 70

Fail

검은색 위

WCAG 4.82:1 · APCA Lc 32

가장 좋은 글자색: #000000

WCAG 4.82:1 (AA) · APCA Lc 32

Contrast pairs

코드 스니펫

CSS

:root {
  --cinder-fox: #7c787b;
  --cinder-fox-rgb: 124 120 123;
  --cinder-fox-oklch: oklch(0.577 0.007 334.1);
}

.element {
  color: var(--cinder-fox);
  background-color: hsl(315 2% 48%);
  border-color: oklch(0.577 0.007 334.1);
}

Tailwind CSS v4

@theme {
  --color-cinder-fox: #7c787b;
  --color-cinder-fox-50: #f6f4f6;
  --color-cinder-fox-100: #e9e7e9;
  --color-cinder-fox-200: #d6d3d5;
  --color-cinder-fox-300: #bab6b9;
  --color-cinder-fox-400: #a19da0;
  --color-cinder-fox-500: #898588;
  --color-cinder-fox-600: #747073;
  --color-cinder-fox-700: #5d5a5c;
  --color-cinder-fox-800: #444143;
  --color-cinder-fox-900: #2f2d2e;
  --color-cinder-fox-950: #1b1a1b;
}

SCSS

$cinder-fox: #7c787b;
$cinder-fox-rgb: 124, 120, 123;
$cinder-fox-light: mix(#fff, $cinder-fox, 20%);
$cinder-fox-dark: mix(#000, $cinder-fox, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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