Nazwany kolor · #FF9F00
Mandarin Peel
Mandarin Peel to #FF9F00: rgb(255 159 0), hsl(37 100% 50%), oklch(0.782 0.172 67.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Mandarin Peel color name →
#FF9F00
oklch(0.782 0.172 67.6)
Konwersje koloru
- HEX
- #ff9f00
- RGB
- rgb(255 159 0)
- HSL
- hsl(37 100% 50%)
- HWB
- hwb(37 0% 0%)
- OKLCH
- oklch(0.782 0.172 67.6)
- OKLab
- oklab(0.782 0.066 0.159)
- CIE Lab
- lab(74.26 30.49 78.34)
- LCH
- lch(74.26 84.07 68.7)
- CMYK
- cmyk(0% 38% 100% 0%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFA93D
- FFB45B
- FFBE73
- FFC789
- FFD19E
- FFDAB2
- FFE4C5
- FFEDD9
- FFF6EC
Odcienie ciemniejsze
- DE8A00
- BE7500
- 9E6100
- 804D00
- 633B00
- 482900
- 2E1800
- 160900
- 030100
Tony
- F29D2C
- E69A3F
- D9974C
- CC9557
- C09260
- B38E68
- A68B6F
- 9A8875
- 8D847B
Harmonie kolorów
Komplementarna +180°
- FF9F00
Mandarin Peel
- 78BFFF
≈ Cooler Than Ever
Analogowa -30° +30°
- FF9F00
Mandarin Peel
- FF997A
≈ Flash in the Pan
- D5B700
≈ Lionhead
Triada +120° +240°
- FF9F00
Mandarin Peel
- 00D3C8
≈ Turquoise Panic
- D19EFF
≈ Plasma Trail
Komplementarna rozszczepiona +150° +210°
- FF9F00
Mandarin Peel
- 00CDF3
≈ Picnic Day Sky
- A7B1FF
≈ Shy Moment
Tetrada +90° +180° +270°
- FF9F00
Mandarin Peel
- 30D88C
≈ Envy’s Love
- 78BFFF
≈ Cooler Than Ever
- FC89DF
≈ Pink Delight
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.05:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.21:1 · APCA Lc 63
Najlepszy kolor tekstu: #000000
WCAG 10.21:1 (AAA) · APCA Lc 63
Contrast pairs
Fragmenty kodu
CSS
:root {
--mandarin-peel: #ff9f00;
--mandarin-peel-rgb: 255 159 0;
--mandarin-peel-oklch: oklch(0.782 0.172 67.6);
}
.element {
color: var(--mandarin-peel);
background-color: hsl(37 100% 50%);
border-color: oklch(0.782 0.172 67.6);
}Tailwind CSS v4
@theme {
--color-mandarin-peel: #ff9f00;
--color-mandarin-peel-50: #ffedc0;
--color-mandarin-peel-100: #ffdea9;
--color-mandarin-peel-200: #ffc781;
--color-mandarin-peel-300: #efa649;
--color-mandarin-peel-400: #e08700;
--color-mandarin-peel-500: #cd6800;
--color-mandarin-peel-600: #ad5800;
--color-mandarin-peel-700: #8b4600;
--color-mandarin-peel-800: #693200;
--color-mandarin-peel-900: #4a2200;
--color-mandarin-peel-950: #301000;
}SCSS
$mandarin-peel: #ff9f00;
$mandarin-peel-rgb: 255, 159, 0;
$mandarin-peel-light: mix(#fff, $mandarin-peel, 20%);
$mandarin-peel-dark: mix(#000, $mandarin-peel, 20%);
.element {
color: $mandarin-peel;
box-shadow: 0 0 0 2px rgba($mandarin-peel, 0.35);
}