Benannte Farbe · #D2783A
Marquis Orange
Marquis Orange ist #D2783A: rgb(210 120 58), hsl(24 63% 53%), oklch(0.661 0.136 52.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Marquis Orange color name →
#D2783A
oklch(0.661 0.136 52.5)
Farbumrechnungen
- HEX
- #d2783a
- RGB
- rgb(210 120 58)
- HSL
- hsl(24 63% 53%)
- HWB
- hwb(24 23% 18%)
- OKLCH
- oklch(0.661 0.136 52.5)
- OKLab
- oklab(0.661 0.083 0.107)
- CIE Lab
- lab(59.94 32.49 48.67)
- LCH
- lch(59.94 58.52 56.3)
- CMYK
- cmyk(0% 43% 72% 18%)
Tints · Shades · Tones
Tints
- D88651
- DD9465
- E2A179
- E7AF8C
- ECBC9F
- F0C9B2
- F4D7C5
- F8E4D8
- FCF2EC
Shades
- B66731
- 9B5728
- 814820
- 683918
- 502A10
- 391D09
- 241004
- 100501
- 020100
Tones
- CA7A44
- C27B4D
- BB7C55
- B37D5C
- AB7E63
- A27F69
- 9A7F6F
- 928075
- 89807B
Farbharmonien
Komplementär +180°
- D2783A
Marquis Orange
- 019FD7
≈ Structural Blue
Analog -30° +30°
- D2783A
Marquis Orange
- D96D6B
≈ Native Berry
- BB8903
≈ Kenyan Sand
Triadisch +120° +240°
- D2783A
Marquis Orange
- 00AB8A
≈ Arcadia
- 9681DE
≈ Indigo Bloom
Geteilt komplementär +150° +210°
- D2783A
Marquis Orange
- 00A6B0
≈ Exotic Sea
- 6590E5
≈ United Nations Blue
Tetradisch +90° +180° +270°
- D2783A
Marquis Orange
- 5DA758
≈ Exploration Green
- 019FD7
≈ Structural Blue
- B974C3
≈ Lavendless
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.23:1 · APCA Lc 59
Ag
AAAuf Schwarz
WCAG 6.48:1 · APCA Lc 42
Beste Textfarbe: #000000
WCAG 6.48:1 (AA) · APCA Lc 42
Contrast pairs
Code-Snippets
CSS
:root {
--marquis-orange: #d2783a;
--marquis-orange-rgb: 210 120 58;
--marquis-orange-oklch: oklch(0.661 0.136 52.5);
}
.element {
color: var(--marquis-orange);
background-color: hsl(24 63% 53%);
border-color: oklch(0.661 0.136 52.5);
}Tailwind CSS v4
@theme {
--color-marquis-orange: #d2783a;
--color-marquis-orange-50: #ffecd1;
--color-marquis-orange-100: #ffddbe;
--color-marquis-orange-200: #ffc59d;
--color-marquis-orange-300: #eda473;
--color-marquis-orange-400: #dc864d;
--color-marquis-orange-500: #ca6819;
--color-marquis-orange-600: #aa5819;
--color-marquis-orange-700: #894614;
--color-marquis-orange-800: #66320f;
--color-marquis-orange-900: #482209;
--color-marquis-orange-950: #2f1100;
}SCSS
$marquis-orange: #d2783a;
$marquis-orange-rgb: 210, 120, 58;
$marquis-orange-light: mix(#fff, $marquis-orange, 20%);
$marquis-orange-dark: mix(#000, $marquis-orange, 20%);
.element {
color: $marquis-orange;
box-shadow: 0 0 0 2px rgba($marquis-orange, 0.35);
}