이름 색상 · #DD262B
Whero Red
Whero Red은(는) #DD262B: rgb(221 38 43), hsl(358 73% 51%), oklch(0.579 0.216 26.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Whero Red color name →
#DD262B
oklch(0.579 0.216 26.3)
색상 변환
- HEX
- #dd262b
- RGB
- rgb(221 38 43)
- HSL
- hsl(358 73% 51%)
- HWB
- hwb(358 15% 13%)
- OKLCH
- oklch(0.579 0.216 26.3)
- OKLab
- oklab(0.579 0.193 0.095)
- CIE Lab
- lab(49.04 68.07 46.47)
- LCH
- lch(49.04 82.41 34.3)
- CMYK
- cmyk(0% 83% 81% 13%)
틴트 · 셰이드 · 톤
틴트
- E44743
- EA6058
- EF766D
- F48B81
- F89F96
- FBB3AA
- FEC6BF
- FFD9D4
- FFECEA
셰이드
- C02024
- A4191D
- 881316
- 6E0D10
- 55080A
- 3D0405
- 260202
- 110101
- 020000
톤
- D53937
- CE4641
- C6514A
- BD5A52
- B4625B
- AB6962
- A2706A
- 977571
- 8C7B79
색 조화
보색 +180°
- DD262B
Whero Red
- 008A97
≈ Zuni
유사색 -30° +30°
- DD262B
Whero Red
- D3267E
≈ Highlighter Lilac
- B76000
≈ Super Leaf Brown
삼각 배색 +120° +240°
- DD262B
Whero Red
- 009430
≈ Irish Green
- 3E6BF7
≈ Secret of Mana
분열 보색 +150° +210°
- DD262B
Whero Red
- 008E78
≈ Emerald Enchantment
- 0084BA
≈ Dresden Blue
사각 배색 +90° +180° +270°
- DD262B
Whero Red
- 768300
≈ Swamp Green
- 008A97
≈ Zuni
- 8A51E8
≈ Gloomy Purple
대비 및 접근성
Ag
AA흰색 위
WCAG 4.78:1 · APCA Lc 71
Ag
Fail검은색 위
WCAG 4.38:1 · APCA Lc 30
가장 좋은 글자색: #FFFFFF
WCAG 4.78:1 (AA) · APCA Lc 71
Contrast pairs
코드 스니펫
CSS
:root {
--whero-red: #dd262b;
--whero-red-rgb: 221 38 43;
--whero-red-oklch: oklch(0.579 0.216 26.3);
}
.element {
color: var(--whero-red);
background-color: hsl(358 73% 51%);
border-color: oklch(0.579 0.216 26.3);
}Tailwind CSS v4
@theme {
--color-whero-red: #dd262b;
--color-whero-red-50: #ffded3;
--color-whero-red-100: #ffcdbf;
--color-whero-red-200: #ffafa0;
--color-whero-red-300: #ff8777;
--color-whero-red-400: #ff5d56;
--color-whero-red-500: #f4232c;
--color-whero-red-600: #ce2327;
--color-whero-red-700: #a61c1f;
--color-whero-red-800: #7c1119;
--color-whero-red-900: #580b10;
--color-whero-red-950: #3b0003;
}SCSS
$whero-red: #dd262b;
$whero-red-rgb: 221, 38, 43;
$whero-red-light: mix(#fff, $whero-red, 20%);
$whero-red-dark: mix(#000, $whero-red, 20%);
.element {
color: $whero-red;
box-shadow: 0 0 0 2px rgba($whero-red, 0.35);
}