이름 색상 · #D45341

Spirit Warrior

Spirit Warrior은(는) #D45341: rgb(212 83 65), hsl(7 63% 54%), oklch(0.609 0.166 30.5). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.

What does Red mean? → · Spirit Warrior color name →

#D45341

oklch(0.609 0.166 30.5)

색상 변환

HEX: #d45341
RGB: rgb(212 83 65)
HSL: hsl(7 63% 54%)
HWB: hwb(7 25% 17%)
OKLCH: oklch(0.609 0.166 30.5)
OKLab: oklab(0.609 0.143 0.084)
CIE Lab: lab(53.13 51.02 37.95)
LCH: lch(53.13 63.59 36.6)
CMYK: cmyk(0% 61% 69% 17%)

틴트 · 셰이드 · 톤

틴트

DB6654
E17867
E68A7A
EB9B8C
F0AC9F
F4BCB2
F8CDC5
FBDED8
FDEEEB

셰이드

B84737
9D3B2E
833025
69251C
511B13
3A110B
240805
100201
020000

톤

CD5A49
C56050
BE6557
B66A5D
AE6E63
A57269
9D766F
947A75
8A7D7A

색 조화

보색 +180°

D45341
Spirit Warrior
0093A6
≈ Brilliant

유사색 -30° +30°

삼각 배색 +120° +240°

분열 보색 +150° +210°

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

대비 및 접근성

흰색 위

WCAG 4.10:1 · APCA Lc 67

Fail

검은색 위

WCAG 5.11:1 · APCA Lc 34

가장 좋은 글자색: #000000

WCAG 5.11:1 (AA) · APCA Lc 34

Contrast pairs

코드 스니펫

CSS

:root {
  --spirit-warrior: #d45341;
  --spirit-warrior-rgb: 212 83 65;
  --spirit-warrior-oklch: oklch(0.609 0.166 30.5);
}

.element {
  color: var(--spirit-warrior);
  background-color: hsl(7 63% 54%);
  border-color: oklch(0.609 0.166 30.5);
}

Tailwind CSS v4

@theme {
  --color-spirit-warrior: #d45341;
  --color-spirit-warrior-50: #ffe5d7;
  --color-spirit-warrior-100: #ffd4c5;
  --color-spirit-warrior-200: #ffbaa7;
  --color-spirit-warrior-300: #ff9680;
  --color-spirit-warrior-400: #f07360;
  --color-spirit-warrior-500: #df4f3c;
  --color-spirit-warrior-600: #bc4434;
  --color-spirit-warrior-700: #973629;
  --color-spirit-warrior-800: #71261f;
  --color-spirit-warrior-900: #501914;
  --color-spirit-warrior-950: #350906;
}

SCSS

$spirit-warrior: #d45341;
$spirit-warrior-rgb: 212, 83, 65;
$spirit-warrior-light: mix(#fff, $spirit-warrior, 20%);
$spirit-warrior-dark: mix(#000, $spirit-warrior, 20%);

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

비슷한 이름 색상

Palettes with similar colors

도구에서 열기

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