命名颜色 · #E33636
Rose Madder
Rose Madder 即 #E33636：rgb(227 54 54)、hsl(0 76% 55%)、oklch(0.602 0.209 26.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Rose Madder color name →
#E33636
oklch(0.602 0.209 26.2)
颜色转换
- HEX
- #e33636
- RGB
- rgb(227 54 54)
- HSL
- hsl(0 76% 55%)
- HWB
- hwb(0 21% 11%)
- OKLCH
- oklch(0.602 0.209 26.2)
- OKLab
- oklab(0.602 0.188 0.092)
- CIE Lab
- lab(51.79 65.96 43.58)
- LCH
- lch(51.79 79.06 33.5)
- CMYK
- cmyk(0% 76% 76% 11%)
浅色调 · 深色调 · 灰色调
浅色调
- E9524B
- EE6860
- F37D73
- F79187
- FAA49B
- FDB6AE
- FFC9C2
- FFDBD6
- FFEDEB
深色调
- C52E2E
- A82525
- 8C1E1E
- 711616
- 570F0F
- 3F0808
- 270303
- 120101
- 030000
灰色调
- DB4440
- D24F48
- C95850
- C06058
- B7665F
- AD6D66
- A3726D
- 987773
- 8C7C7A
配色和谐
互补色 +180°
- E33636
Rose Madder
- 00929F
≈ Jaded
类似色 -30° +30°
- E33636
Rose Madder
- D93584
≈ Sensual Climax
- C16500
≈ Hawaiian Sunset
三角配色 +120° +240°
- E33636
Rose Madder
- 009C32
≈ Peppermint Toad
- 4674FC
≈ Lightish Blue
分裂互补色 +150° +210°
- E33636
Rose Madder
- 00967F
≈ Aqua Waters
- 008BC4
≈ Celebration Blue
四角配色 +90° +180° +270°
- E33636
Rose Madder
- 7D8A00
≈ Krypton Green
- 00929F
≈ Jaded
- 905BED
≈ Lavender Indigo
对比度与无障碍
Ag
Fail白底
WCAG 4.33:1 · APCA Lc 68
Ag
AA黑底
WCAG 4.84:1 · APCA Lc 33
最佳文字颜色: #000000
WCAG 4.84:1 (AA) · APCA Lc 33
Contrast pairs
代码片段
CSS
:root {
--rose-madder: #e33636;
--rose-madder-rgb: 227 54 54;
--rose-madder-oklch: oklch(0.602 0.209 26.2);
}
.element {
color: var(--rose-madder);
background-color: hsl(0 76% 55%);
border-color: oklch(0.602 0.209 26.2);
}Tailwind CSS v4
@theme {
--color-rose-madder: #e33636;
--color-rose-madder-50: #ffdfd4;
--color-rose-madder-100: #ffcec1;
--color-rose-madder-200: #ffb0a1;
--color-rose-madder-300: #ff8979;
--color-rose-madder-400: #ff6058;
--color-rose-madder-500: #f22b31;
--color-rose-madder-600: #cc282b;
--color-rose-madder-700: #a42122;
--color-rose-madder-800: #7b151a;
--color-rose-madder-900: #570e11;
--color-rose-madder-950: #3a0004;
}SCSS
$rose-madder: #e33636;
$rose-madder-rgb: 227, 54, 54;
$rose-madder-light: mix(#fff, $rose-madder, 20%);
$rose-madder-dark: mix(#000, $rose-madder, 20%);
.element {
color: $rose-madder;
box-shadow: 0 0 0 2px rgba($rose-madder, 0.35);
}