Nazwany kolor · #EFA06B
Monarch Orange
Monarch Orange to #EFA06B: rgb(239 160 107), hsl(24 80% 68%), oklch(0.773 0.117 54). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Monarch Orange color name →
#EFA06B
oklch(0.773 0.117 54)
Konwersje koloru
- HEX
- #efa06b
- RGB
- rgb(239 160 107)
- HSL
- hsl(24 80% 68%)
- HWB
- hwb(24 42% 6%)
- OKLCH
- oklch(0.773 0.117 54)
- OKLab
- oklab(0.773 0.069 0.094)
- CIE Lab
- lab(73.09 26.3 40.01)
- LCH
- lch(73.09 47.88 56.7)
- CMYK
- cmyk(0% 33% 55% 6%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F1AA7B
- F4B38A
- F6BD99
- F8C7A7
- F9D0B6
- FBD9C5
- FCE3D3
- FDECE2
- FEF6F0
Odcienie ciemniejsze
- D08B5C
- B1764E
- 94613F
- 784E32
- 5C3B25
- 422918
- 2A190D
- 140904
- 030100
Tony
- E49D6E
- D99A71
- CE9774
- C39476
- B89178
- AD8E7A
- A18A7C
- 96877D
- 8B847F
Harmonie kolorów
Komplementarna +180°
- EFA06B
Monarch Orange
- 60C1F4
≈ Blue Mana
Analogowa -30° +30°
- EFA06B
Monarch Orange
- F79791
≈ Cherrystone
- D8AF57
≈ Golden Cricket
Triada +120° +240°
- EFA06B
Monarch Orange
- 55CDAF
≈ Simply Aqua
- B9A6F8
≈ Winterspring Lilac
Komplementarna rozszczepiona +150° +210°
- EFA06B
Monarch Orange
- 3FCAD7
≈ Sea Serpent
- 90B4FF
≈ Carolina Blue
Tetrada +90° +180° +270°
- EFA06B
Monarch Orange
- 86C985
≈ De York
- 60C1F4
≈ Blue Mana
- DA9BDF
≈ Herb Robert
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.11:1 · APCA Lc 41
Ag
AAANa czerni
WCAG 9.91:1 · APCA Lc 61
Najlepszy kolor tekstu: #000000
WCAG 9.91:1 (AAA) · APCA Lc 61
Contrast pairs
Fragmenty kodu
CSS
:root {
--monarch-orange: #efa06b;
--monarch-orange-rgb: 239 160 107;
--monarch-orange-oklch: oklch(0.773 0.117 54);
}
.element {
color: var(--monarch-orange);
background-color: hsl(24 80% 68%);
border-color: oklch(0.773 0.117 54);
}Tailwind CSS v4
@theme {
--color-monarch-orange: #efa06b;
--color-monarch-orange-50: #ffedd6;
--color-monarch-orange-100: #ffdfc3;
--color-monarch-orange-200: #fcc8a4;
--color-monarch-orange-300: #e6a87c;
--color-monarch-orange-400: #d48b59;
--color-monarch-orange-500: #c16e31;
--color-monarch-orange-600: #a35e2b;
--color-monarch-orange-700: #834b22;
--color-monarch-orange-800: #613518;
--color-monarch-orange-900: #44240f;
--color-monarch-orange-950: #2c1303;
}SCSS
$monarch-orange: #efa06b;
$monarch-orange-rgb: 239, 160, 107;
$monarch-orange-light: mix(#fff, $monarch-orange, 20%);
$monarch-orange-dark: mix(#000, $monarch-orange, 20%);
.element {
color: $monarch-orange;
box-shadow: 0 0 0 2px rgba($monarch-orange, 0.35);
}