Benannte Farbe · #F4893D
Hot Orange
Hot Orange ist #F4893D: rgb(244 137 61), hsl(25 89% 60%), oklch(0.734 0.157 52.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Hot Orange color name →
#F4893D
oklch(0.734 0.157 52.6)
Farbumrechnungen
- HEX
- #f4893d
- RGB
- rgb(244 137 61)
- HSL
- hsl(25 89% 60%)
- HWB
- hwb(25 24% 4%)
- OKLCH
- oklch(0.734 0.157 52.6)
- OKLab
- oklab(0.734 0.095 0.125)
- CIE Lab
- lab(68.27 37.77 57.33)
- LCH
- lch(68.27 68.66 56.6)
- CMYK
- cmyk(0% 44% 75% 4%)
Tints · Shades · Tones
Tints
- F69655
- F9A26A
- FBAE7E
- FCBA91
- FEC6A4
- FFD1B6
- FFDDC8
- FFE8DB
- FFF4ED
Shades
- D47634
- B5642B
- 975322
- 7A421A
- 5E3112
- 44220A
- 2B1404
- 140701
- 030100
Tones
- E98948
- DD8951
- D28859
- C78860
- BB8767
- B0866D
- A48572
- 988377
- 8C827C
Farbharmonien
Komplementär +180°
- F4893D
Hot Orange
- 00B7F7
≈ Blue Bolt
Analog -30° +30°
- F4893D
Hot Orange
- FC7C7A
≈ Forbidden Fruit
- D79E00
≈ Immortelle Yellow
Triadisch +120° +240°
- F4893D
Hot Orange
- 00C5A0
≈ Jadeite
- AD95FF
≈ Cobalite
Geteilt komplementär +150° +210°
- F4893D
Hot Orange
- 00BFCB
≈ Panorama Blue
- 7AA7FF
≈ Fennel Flower
Tetradisch +90° +180° +270°
- F4893D
Hot Orange
- 68C162
≈ Verdant Oasis
- 00B7F7
≈ Blue Bolt
- D785E2
≈ Blush Essence
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.47:1 · APCA Lc 48
Ag
AAAAuf Schwarz
WCAG 8.49:1 · APCA Lc 54
Beste Textfarbe: #000000
WCAG 8.49:1 (AAA) · APCA Lc 54
Contrast pairs
Code-Snippets
CSS
:root {
--hot-orange: #f4893d;
--hot-orange-rgb: 244 137 61;
--hot-orange-oklch: oklch(0.734 0.157 52.6);
}
.element {
color: var(--hot-orange);
background-color: hsl(25 89% 60%);
border-color: oklch(0.734 0.157 52.6);
}Tailwind CSS v4
@theme {
--color-hot-orange: #f4893d;
--color-hot-orange-50: #ffeacb;
--color-hot-orange-100: #ffdbb6;
--color-hot-orange-200: #ffc293;
--color-hot-orange-300: #f5a166;
--color-hot-orange-400: #e58039;
--color-hot-orange-500: #d36000;
--color-hot-orange-600: #b25200;
--color-hot-orange-700: #8f4200;
--color-hot-orange-800: #6b2e00;
--color-hot-orange-900: #4b1f00;
--color-hot-orange-950: #310e00;
}SCSS
$hot-orange: #f4893d;
$hot-orange-rgb: 244, 137, 61;
$hot-orange-light: mix(#fff, $hot-orange, 20%);
$hot-orange-dark: mix(#000, $hot-orange, 20%);
.element {
color: $hot-orange;
box-shadow: 0 0 0 2px rgba($hot-orange, 0.35);
}