Nazwany kolor · #EE6633
Flaming Orange
Flaming Orange to #EE6633: rgb(238 102 51), hsl(16 85% 57%), oklch(0.672 0.18 39.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Red mean? → · Flaming Orange color name →
#EE6633
oklch(0.672 0.18 39.7)
Konwersje koloru
- HEX
- #ee6633
- RGB
- rgb(238 102 51)
- HSL
- hsl(16 85% 57%)
- HWB
- hwb(16 20% 7%)
- OKLCH
- oklch(0.672 0.18 39.7)
- OKLab
- oklab(0.672 0.138 0.115)
- CIE Lab
- lab(60.56 51.62 54.27)
- LCH
- lch(60.56 74.9 46.4)
- CMYK
- cmyk(0% 57% 79% 7%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- F2774C
- F58862
- F89776
- FBA78A
- FDB69D
- FEC5B1
- FFD3C4
- FFE2D8
- FFF0EB
Odcienie ciemniejsze
- CF582B
- B14A23
- 933C1C
- 772F14
- 5C230D
- 421707
- 2A0C03
- 140401
- 030000
Tony
- E46B3F
- DA6F49
- CF7252
- C5755A
- BA7861
- AF7A68
- A47C6E
- 987E74
- 8C7F7A
Harmonie kolorów
Komplementarna +180°
- EE6633
Flaming Orange
- 00A7C9
≈ Gummy Dolphins
Analogowa -30° +30°
- EE6633
Flaming Orange
- EE5D7D
≈ Highlighter Pink
- CE8300
≈ Copious Caramel
Triada +120° +240°
- EE6633
Flaming Orange
- 00B274
≈ Green Teal
- 8385FF
≈ Blue Party Parrot
Komplementarna rozszczepiona +150° +210°
- EE6633
Flaming Orange
- 00ACA5
≈ Teal Me No Lies
- 1C9AFF
≈ Blue Nebula
Tetrada +90° +180° +270°
- EE6633
Flaming Orange
- 71AA01
≈ Green Envy
- 00A7C9
≈ Gummy Dolphins
- B771E8
≈ Lavender
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.18:1 · APCA Lc 58
Ag
AANa czerni
WCAG 6.58:1 · APCA Lc 43
Najlepszy kolor tekstu: #000000
WCAG 6.58:1 (AA) · APCA Lc 43
Contrast pairs
Fragmenty kodu
CSS
:root {
--flaming-orange: #ee6633;
--flaming-orange-rgb: 238 102 51;
--flaming-orange-oklch: oklch(0.672 0.18 39.7);
}
.element {
color: var(--flaming-orange);
background-color: hsl(16 85% 57%);
border-color: oklch(0.672 0.18 39.7);
}Tailwind CSS v4
@theme {
--color-flaming-orange: #ee6633;
--color-flaming-orange-50: #ffe5cd;
--color-flaming-orange-100: #ffd5b9;
--color-flaming-orange-200: #ffba97;
--color-flaming-orange-300: #ff966b;
--color-flaming-orange-400: #f47244;
--color-flaming-orange-500: #e34c00;
--color-flaming-orange-600: #bf4206;
--color-flaming-orange-700: #9a3507;
--color-flaming-orange-800: #732408;
--color-flaming-orange-900: #511806;
--color-flaming-orange-950: #360800;
}SCSS
$flaming-orange: #ee6633;
$flaming-orange-rgb: 238, 102, 51;
$flaming-orange-light: mix(#fff, $flaming-orange, 20%);
$flaming-orange-dark: mix(#000, $flaming-orange, 20%);
.element {
color: $flaming-orange;
box-shadow: 0 0 0 2px rgba($flaming-orange, 0.35);
}