Named color · #DD8811
Non-Stop Orange
Non-Stop Orange is #DD8811: rgb(221 136 17), hsl(35 86% 47%), oklch(0.7 0.152 66). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Non-Stop Orange color name →
#DD8811
oklch(0.7 0.152 66)
Color conversions
- HEX
- #dd8811
- RGB
- rgb(221 136 17)
- HSL
- hsl(35 86% 47%)
- HWB
- hwb(35 7% 13%)
- OKLCH
- oklch(0.7 0.152 66)
- OKLab
- oklab(0.7 0.062 0.139)
- CIE Lab
- lab(64.78 28.07 67.61)
- LCH
- lch(64.78 73.2 67.5)
- CMYK
- cmyk(0% 38% 92% 13%)
Tints · Shades · Tones
Tints
- E1943C
- E6A157
- E9AD6E
- EDB984
- F1C499
- F4D0AE
- F7DCC2
- FAE8D6
- FDF3EB
Shades
- C0750D
- A46309
- 885206
- 6E4104
- 553102
- 3D2201
- 261300
- 110600
- 020100
Tones
- D4882D
- CB883D
- C28749
- B98753
- AF865C
- A68565
- 9D846C
- 938373
- 8A827A
Color harmonies
Complementary +180°
- DD8811
Non-Stop Orange
- 3CA5F7
≈ Rockman Blue
Analogous -30° +30°
- DD8811
Non-Stop Orange
- ED7858
≈ Temple of Orange
- B99D00
≈ Perennial
Triadic +120° +240°
- DD8811
Non-Stop Orange
- 00B7AA
≈ Verditer
- B683E9
≈ Lavender Blossom
Split-complementary +150° +210°
- DD8811
Non-Stop Orange
- 00B1D0
≈ Aquarius
- 8694FC
≈ Periwinkle Blue
Tetradic +90° +180° +270°
- DD8811
Non-Stop Orange
- 34BA75
≈ Ceramic Green
- 3CA5F7
≈ Rockman Blue
- D877C2
≈ Purple Kush
Contrast & accessibility
Ag
FailOn white
WCAG 2.76:1 · APCA Lc 53
Ag
AAAOn black
WCAG 7.60:1 · APCA Lc 49
Best text color: #000000
WCAG 7.60:1 (AAA) · APCA Lc 49
Contrast pairs
Code snippets
CSS
:root {
--non-stop-orange: #dd8811;
--non-stop-orange-rgb: 221 136 17;
--non-stop-orange-oklch: oklch(0.7 0.152 66);
}
.element {
color: var(--non-stop-orange);
background-color: hsl(35 86% 47%);
border-color: oklch(0.7 0.152 66);
}Tailwind CSS v4
@theme {
--color-non-stop-orange: #dd8811;
--color-non-stop-orange-50: #ffeec7;
--color-non-stop-orange-100: #ffdfb2;
--color-non-stop-orange-200: #ffc88c;
--color-non-stop-orange-300: #eba85c;
--color-non-stop-orange-400: #da8924;
--color-non-stop-orange-500: #c76c00;
--color-non-stop-orange-600: #a85c00;
--color-non-stop-orange-700: #874900;
--color-non-stop-orange-800: #653400;
--color-non-stop-orange-900: #472300;
--color-non-stop-orange-950: #2e1200;
}SCSS
$non-stop-orange: #dd8811;
$non-stop-orange-rgb: 221, 136, 17;
$non-stop-orange-light: mix(#fff, $non-stop-orange, 20%);
$non-stop-orange-dark: mix(#000, $non-stop-orange, 20%);
.element {
color: $non-stop-orange;
box-shadow: 0 0 0 2px rgba($non-stop-orange, 0.35);
}