Named color · #FF3A2D
Redshift
Redshift is #FF3A2D: rgb(255 58 45), hsl(4 100% 59%), oklch(0.653 0.233 29.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Red mean? → · Redshift color name →
#FF3A2D
oklch(0.653 0.233 29.1)
Color conversions
- HEX
- #ff3a2d
- RGB
- rgb(255 58 45)
- HSL
- hsl(4 100% 59%)
- HWB
- hwb(4 18% 0%)
- OKLCH
- oklch(0.653 0.233 29.1)
- OKLab
- oklab(0.653 0.204 0.113)
- CIE Lab
- lab(57.5 72.75 55.82)
- LCH
- lch(57.5 91.7 37.5)
- CMYK
- cmyk(0% 77% 82% 0%)
Tints · Shades · Tones
Tints
- FF5747
- FF6E5D
- FF8372
- FF9686
- FFA99A
- FFBBAE
- FFCCC2
- FFDDD6
- FFEEEB
Shades
- DE3126
- BE281F
- 9E2018
- 801811
- 63100B
- 480906
- 2E0402
- 160101
- 030000
Tones
- F4493A
- E85445
- DD5D4E
- D16456
- C56B5E
- B87066
- AB756D
- 9E7973
- 8F7D7A
Color harmonies
Complementary +180°
- FF3A2D
Redshift
- 00A2B5
≈ January Blue
Analogous -30° +30°
- FF3A2D
Redshift
- F6368D
≈ Prickly Pink
- D37400
≈ Tree Sap
Triadic +120° +240°
- FF3A2D
Redshift
- 00AD4B
≈ Poison Ivy
- 6385FF
≈ Deep Denim
Split-complementary +150° +210°
- FF3A2D
Redshift
- 00A792
≈ Persian Green
- 009ADF
≈ Atmosphere
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 3.56:1 · APCA Lc 61
Ag
AAOn black
WCAG 5.89:1 · APCA Lc 40
Best text color: #000000
WCAG 5.89:1 (AA) · APCA Lc 40
Contrast pairs
Code snippets
CSS
:root {
--redshift: #ff3a2d;
--redshift-rgb: 255 58 45;
--redshift-oklch: oklch(0.653 0.233 29.1);
}
.element {
color: var(--redshift);
background-color: hsl(4 100% 59%);
border-color: oklch(0.653 0.233 29.1);
}Tailwind CSS v4
@theme {
--color-redshift: #ff3a2d;
--color-redshift-50: #ffddcd;
--color-redshift-100: #ffcbb8;
--color-redshift-200: #ffac96;
--color-redshift-300: #ff826a;
--color-redshift-400: #ff5544;
--color-redshift-500: #fc0000;
--color-redshift-600: #d40c09;
--color-redshift-700: #ab0d09;
--color-redshift-800: #80050b;
--color-redshift-900: #5b0507;
--color-redshift-950: #3d0000;
}SCSS
$redshift: #ff3a2d;
$redshift-rgb: 255, 58, 45;
$redshift-light: mix(#fff, $redshift, 20%);
$redshift-dark: mix(#000, $redshift, 20%);
.element {
color: $redshift;
box-shadow: 0 0 0 2px rgba($redshift, 0.35);
}