Nazwany kolor · #D28034
Yellow Mandarin
Yellow Mandarin to #D28034: rgb(210 128 52), hsl(29 64% 51%), oklch(0.674 0.134 59.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Yellow Mandarin color name →
#D28034
oklch(0.674 0.134 59.6)
Konwersje koloru
- HEX
- #d28034
- RGB
- rgb(210 128 52)
- HSL
- hsl(29 64% 51%)
- HWB
- hwb(29 20% 18%)
- OKLCH
- oklch(0.674 0.134 59.6)
- OKLab
- oklab(0.674 0.068 0.116)
- CIE Lab
- lab(61.67 28.23 53.1)
- LCH
- lch(61.67 60.14 62)
- CMYK
- cmyk(0% 39% 75% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D78D4D
- DD9A63
- E2A777
- E7B38B
- EBC09E
- F0CDB1
- F4D9C5
- F8E6D8
- FBF2EB
Odcienie ciemniejsze
- B66E2C
- 9B5D24
- 814D1C
- 683D15
- 502E0E
- 391F07
- 241203
- 100601
- 020100
Tony
- CA8140
- C2814A
- BA8253
- B2825B
- AA8262
- A28269
- 9A816F
- 918175
- 89817B
Harmonie kolorów
Komplementarna +180°
- D28034
Yellow Mandarin
- 33A0E0
≈ Dayflower
Analogowa -30° +30°
- D28034
Yellow Mandarin
- DD7464
≈ Mettwurst
- B79110
≈ Faint Gold
Triada +120° +240°
- D28034
Yellow Mandarin
- 00AF99
≈ Pool Green
- A382DD
≈ Lavender Blossom
Komplementarna rozszczepiona +150° +210°
- D28034
Yellow Mandarin
- 00A9BE
≈ Sarah’s Garden
- 7691E9
≈ Guilliman Blue
Tetrada +90° +180° +270°
- D28034
Yellow Mandarin
- 51AD68
≈ Algae
- 33A0E0
≈ Dayflower
- C476BE
≈ Gulābī Pink
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.05:1 · APCA Lc 57
Ag
AANa czerni
WCAG 6.87:1 · APCA Lc 45
Najlepszy kolor tekstu: #000000
WCAG 6.87:1 (AA) · APCA Lc 45
Contrast pairs
Fragmenty kodu
CSS
:root {
--yellow-mandarin: #d28034;
--yellow-mandarin-rgb: 210 128 52;
--yellow-mandarin-oklch: oklch(0.674 0.134 59.6);
}
.element {
color: var(--yellow-mandarin);
background-color: hsl(29 64% 51%);
border-color: oklch(0.674 0.134 59.6);
}Tailwind CSS v4
@theme {
--color-yellow-mandarin: #d28034;
--color-yellow-mandarin-50: #ffedcf;
--color-yellow-mandarin-100: #ffdfbb;
--color-yellow-mandarin-200: #ffc899;
--color-yellow-mandarin-300: #e9a76d;
--color-yellow-mandarin-400: #d88944;
--color-yellow-mandarin-500: #c56c00;
--color-yellow-mandarin-600: #a65c05;
--color-yellow-mandarin-700: #864907;
--color-yellow-mandarin-800: #643405;
--color-yellow-mandarin-900: #462404;
--color-yellow-mandarin-950: #2d1200;
}SCSS
$yellow-mandarin: #d28034;
$yellow-mandarin-rgb: 210, 128, 52;
$yellow-mandarin-light: mix(#fff, $yellow-mandarin, 20%);
$yellow-mandarin-dark: mix(#000, $yellow-mandarin, 20%);
.element {
color: $yellow-mandarin;
box-shadow: 0 0 0 2px rgba($yellow-mandarin, 0.35);
}