命名颜色 · #EE3344
Red Radish
Red Radish 即 #EE3344:rgb(238 51 68)、hsl(355 85% 57%)、oklch(0.621 0.22 22.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Red Radish color name →
#EE3344
oklch(0.621 0.22 22.3)
颜色转换
- HEX
- #ee3344
- RGB
- rgb(238 51 68)
- HSL
- hsl(355 85% 57%)
- HWB
- hwb(355 20% 7%)
- OKLCH
- oklch(0.621 0.22 22.3)
- OKLab
- oklab(0.621 0.204 0.084)
- CIE Lab
- lab(53.76 70.3 38.5)
- LCH
- lch(53.76 80.15 28.7)
- CMYK
- cmyk(0% 79% 71% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- F35157
- F7686A
- FB7D7C
- FE918E
- FFA4A1
- FFB7B3
- FFC9C6
- FFDBD9
- FFEDEC
深色调
- CF2B3A
- B12330
- 931C26
- 77141D
- 5C0D14
- 42070C
- 2A0305
- 140102
- 030000
灰色调
- E5424B
- DB4E52
- D15859
- C7605F
- BC6765
- B26D6A
- A67270
- 9A7775
- 8E7C7B
配色和谐
互补色 +180°
- EE3344
Red Radish
- 0099A2
≈ Island Dream
类似色 -30° +30°
- EE3344
Red Radish
- E13693
≈ Pinkinity
- CE6500
≈ Curry Powder
三角配色 +120° +240°
- EE3344
Red Radish
- 07A300
≈ Peter Pan
- 3D7EFF
≈ Ceruleite
分裂互补色 +150° +210°
- EE3344
Red Radish
- 009D7F
≈ Tropical Kelp
- 0092C6
≈ Dynamic Blue
四角配色 +90° +180° +270°
- EE3344
Red Radish
- 898E00
≈ Old Asparagus
- 0099A2
≈ Island Dream
- 8F61FD
≈ Purple Anemone
对比度与无障碍
Ag
Fail白底
WCAG 4.04:1 · APCA Lc 66
Ag
AA黑底
WCAG 5.19:1 · APCA Lc 36
最佳文字颜色: #000000
WCAG 5.19:1 (AA) · APCA Lc 36
Contrast pairs
代码片段
CSS
:root {
--red-radish: #ee3344;
--red-radish-rgb: 238 51 68;
--red-radish-oklch: oklch(0.621 0.22 22.3);
}
.element {
color: var(--red-radish);
background-color: hsl(355 85% 57%);
border-color: oklch(0.621 0.22 22.3);
}Tailwind CSS v4
@theme {
--color-red-radish: #ee3344;
--color-red-radish-50: #ffddd6;
--color-red-radish-100: #ffcbc4;
--color-red-radish-200: #ffada5;
--color-red-radish-300: #ff847e;
--color-red-radish-400: #ff595f;
--color-red-radish-500: #f6173b;
--color-red-radish-600: #d01b33;
--color-red-radish-700: #a71728;
--color-red-radish-800: #7d0d1f;
--color-red-radish-900: #590915;
--color-red-radish-950: #3b0006;
}SCSS
$red-radish: #ee3344;
$red-radish-rgb: 238, 51, 68;
$red-radish-light: mix(#fff, $red-radish, 20%);
$red-radish-dark: mix(#000, $red-radish, 20%);
.element {
color: $red-radish;
box-shadow: 0 0 0 2px rgba($red-radish, 0.35);
}