Benannte Farbe · #FF3311
Rocket Science
Rocket Science ist #FF3311: rgb(255 51 17), hsl(9 100% 53%), oklch(0.647 0.24 31.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Rocket Science color name →
#FF3311
oklch(0.647 0.24 31.6)
Farbumrechnungen
- HEX
- #ff3311
- RGB
- rgb(255 51 17)
- HSL
- hsl(9 100% 53%)
- HWB
- hwb(9 7% 0%)
- OKLCH
- oklch(0.647 0.24 31.6)
- OKLab
- oklab(0.647 0.204 0.126)
- CIE Lab
- lab(56.74 74.19 66.45)
- LCH
- lch(56.74 99.6 41.9)
- CMYK
- cmyk(0% 80% 93% 0%)
Tints · Shades · Tones
Tints
- FF5338
- FF6B52
- FF8169
- FF957F
- FFA794
- FFBAAA
- FFCBBF
- FFDDD4
- FFEEE9
Shades
- DE2B0D
- BE2309
- 9E1C06
- 801404
- 630D02
- 480701
- 2E0300
- 160100
- 030000
Tones
- F44429
- E85038
- DD5A45
- D1624F
- C56958
- B86F61
- AB7469
- 9E7971
- 8F7D79
Farbharmonien
Komplementär +180°
- FF3311
Rocket Science
- 00A0B5
≈ January Blue
Analog -30° +30°
- FF3311
Rocket Science
- F82B84
≈ Pink Piano
- CD7500
≈ Mountain Ash
Triadisch +120° +240°
- FF3311
Rocket Science
- 00AA55
≈ Rita Repulsa
- 6781FF
≈ Deep Denim
Geteilt komplementär +150° +210°
- FF3311
Rocket Science
- 00A593
≈ Persian Green
- 0097E2
≈ Atmosphere
Tetradisch +90° +180° +270°
- FF3311
Rocket Science
- 809C00
≈ Luminescent Green
- 00A0B5
≈ January Blue
- A95FFF
≈ Purple Hedonist
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.66:1 · APCA Lc 62
Ag
AAAuf Schwarz
WCAG 5.73:1 · APCA Lc 39
Beste Textfarbe: #000000
WCAG 5.73:1 (AA) · APCA Lc 39
Contrast pairs
Code-Snippets
CSS
:root {
--rocket-science: #ff3311;
--rocket-science-rgb: 255 51 17;
--rocket-science-oklch: oklch(0.647 0.24 31.6);
}
.element {
color: var(--rocket-science);
background-color: hsl(9 100% 53%);
border-color: oklch(0.647 0.24 31.6);
}Tailwind CSS v4
@theme {
--color-rocket-science: #ff3311;
--color-rocket-science-50: #ffddc8;
--color-rocket-science-100: #ffcab3;
--color-rocket-science-200: #ffac8f;
--color-rocket-science-300: #ff8160;
--color-rocket-science-400: #ff5235;
--color-rocket-science-500: #fe0000;
--color-rocket-science-600: #d70000;
--color-rocket-science-700: #ad0500;
--color-rocket-science-800: #820000;
--color-rocket-science-900: #5c0301;
--color-rocket-science-950: #3e0000;
}SCSS
$rocket-science: #ff3311;
$rocket-science-rgb: 255, 51, 17;
$rocket-science-light: mix(#fff, $rocket-science, 20%);
$rocket-science-dark: mix(#000, $rocket-science, 20%);
.element {
color: $rocket-science;
box-shadow: 0 0 0 2px rgba($rocket-science, 0.35);
}