命名颜色 · #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