Nazwany kolor · #DFA837
Dutch Orange
Dutch Orange to #DFA837: rgb(223 168 55), hsl(40 72% 55%), oklch(0.764 0.139 81.3). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Dutch Orange color name →
#DFA837
oklch(0.764 0.139 81.3)
Konwersje koloru
- HEX
- #dfa837
- RGB
- rgb(223 168 55)
- HSL
- hsl(40 72% 55%)
- HWB
- hwb(40 22% 13%)
- OKLCH
- oklch(0.764 0.139 81.3)
- OKLab
- oklab(0.764 0.021 0.138)
- CIE Lab
- lab(72.71 13.36 62.79)
- LCH
- lch(72.71 64.2 78)
- CMYK
- cmyk(0% 25% 75% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- E3B153
- E6BA69
- E9C37E
- EDCB91
- F0D4A4
- F3DDB7
- F6E5C9
- F9EEDB
- FCF7ED
Odcienie ciemniejsze
- C2922E
- A57C26
- 8A671E
- 6F5216
- 563F0F
- 3D2C08
- 271A03
- 120A01
- 020100
Tony
- D5A445
- CCA14F
- C29D58
- B89960
- AF9567
- A5916D
- 9C8D72
- 938977
- 89847C
Harmonie kolorów
Komplementarna +180°
- DFA837
Dutch Orange
- 87B2FF
≈ Parakeet Blue
Analogowa -30° +30°
- DFA837
Dutch Orange
- F8975A
≈ Indian Paintbrush
- B6BA44
≈ Japanese Fern
Triada +120° +240°
- DFA837
Dutch Orange
- 00CAD4
≈ Jade Glass
- DB93E8
≈ Bright Lilac
Komplementarna rozszczepiona +150° +210°
- DFA837
Dutch Orange
- 38C1FB
≈ Shovel Knight
- B3A3FF
≈ Shy Moment
Tetrada +90° +180° +270°
- DFA837
Dutch Orange
- 2FCEA7
≈ Mint Jelly
- 87B2FF
≈ Parakeet Blue
- F48BBD
≈ Cochonnet
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.14:1 · APCA Lc 42
Ag
AAANa czerni
WCAG 9.79:1 · APCA Lc 60
Najlepszy kolor tekstu: #000000
WCAG 9.79:1 (AAA) · APCA Lc 60
Contrast pairs
Fragmenty kodu
CSS
:root {
--dutch-orange: #dfa837;
--dutch-orange-rgb: 223 168 55;
--dutch-orange-oklch: oklch(0.764 0.139 81.3);
}
.element {
color: var(--dutch-orange);
background-color: hsl(40 72% 55%);
border-color: oklch(0.764 0.139 81.3);
}Tailwind CSS v4
@theme {
--color-dutch-orange: #dfa837;
--color-dutch-orange-50: #fff2c8;
--color-dutch-orange-100: #ffe5b3;
--color-dutch-orange-200: #f1cf8f;
--color-dutch-orange-300: #dab15f;
--color-dutch-orange-400: #c89528;
--color-dutch-orange-500: #b47900;
--color-dutch-orange-600: #986700;
--color-dutch-orange-700: #7a5200;
--color-dutch-orange-800: #5b3b00;
--color-dutch-orange-900: #402900;
--color-dutch-orange-950: #291600;
}SCSS
$dutch-orange: #dfa837;
$dutch-orange-rgb: 223, 168, 55;
$dutch-orange-light: mix(#fff, $dutch-orange, 20%);
$dutch-orange-dark: mix(#000, $dutch-orange, 20%);
.element {
color: $dutch-orange;
box-shadow: 0 0 0 2px rgba($dutch-orange, 0.35);
}