# Vivid analogous maroon to orange linear gradient Vivid analogous maroon to orange linear gradient with 32 colors: #500100, #540100, #5a0100, #610100, #690100, #720100, #7b0200, #840300, #8e0500, #970800, #9f0d00, #a81200, #b01800, #b81d00, #c12300, #c92902, #d12f03, #d93603, #e03d03, #e74402, #ed4b00, #f15300, #f45c00, #f76400, #f96d00, #fb7600, #fc7e00, #fd8500, #fe8c00, #ff9207, #ff9713, #ff9b19. Edit it and copy or download CSS, SVG, PNG or shader code. - Seed: `kURVAVOcHAFJLwPivcLg` - Page: https://grabient.com/kURVAVOcHAFJLwPivcLg?steps=32&angle=135 - Drawn as: linear gradient, 32 steps, 135 degrees - Kinds: dark to light, vivid, warm - Hues: analogous - Contrast of its darkest and lightest colors: 7.3 to 1 ## Colors The name most people give each color, and the text color that reads on it with its contrast. | Stop | Hex | OKLCH | Name | Text on it | | --- | --- | --- | --- | --- | | 1 | `#500100` | `oklch(27.17% 0.1102 29.53)` | Umbral Umber | white, 15.6 to 1 | | 2 | `#540100` | `oklch(28.20% 0.1144 29.56)` | Soooo Bloody | white, 15.1 to 1 | | 3 | `#5a0100` | `oklch(29.51% 0.1200 29.53)` | Mathematical Rage | white, 14.5 to 1 | | 4 | `#610100` | `oklch(31.07% 0.1267 29.43)` | Spikey Red | white, 13.8 to 1 | | 5 | `#690100` | `oklch(32.81% 0.1340 29.40)` | Khorne Red | white, 13 to 1 | | 6 | `#720100` | `oklch(34.69% 0.1416 29.42)` | Hellbound | white, 12.2 to 1 | | 7 | `#7b0200` | `oklch(36.68% 0.1494 29.48)` | Demon | white, 11.3 to 1 | | 8 | `#840300` | `oklch(38.71% 0.1572 29.58)` | Dark Red | white, 10.5 to 1 | | 9 | `#8e0500` | `oklch(40.75% 0.1646 29.76)` | Scoville Highness | white, 9.6 to 1 | | 10 | `#970800` | `oklch(42.75% 0.1713 30.02)` | Crimson Red | white, 8.9 to 1 | | 11 | `#9f0d00` | `oklch(44.67% 0.1771 30.39)` | Megido Red | white, 8.2 to 1 | | 12 | `#a81200` | `oklch(46.50% 0.1820 30.84)` | Kid Icarus | white, 7.6 to 1 | | 13 | `#b01800` | `oklch(48.39% 0.1869 31.31)` | Tomato Sauce | white, 7 to 1 | | 14 | `#b81d00` | `oklch(50.33% 0.1918 31.79)` | International Orange | white, 6.5 to 1 | | 15 | `#c12300` | `oklch(52.29% 0.1961 32.35)` | Crimson Sunset | white, 6 to 1 | | 16 | `#c92902` | `oklch(54.26% 0.1996 32.96)` | Piment Piquant | white, 5.5 to 1 | | 17 | `#d12f03` | `oklch(56.22% 0.2025 33.66)` | Native Hue of Resolution | white, 5 to 1 | | 18 | `#d93603` | `oklch(58.14% 0.2049 34.49)` | Red Bell Pepper | white, 4.6 to 1 | | 19 | `#e03d03` | `oklch(60.01% 0.2067 35.48)` | Torii Red | black, 4.8 to 1 | | 20 | `#e74402` | `oklch(61.80% 0.2078 36.64)` | Baptism by Fire | black, 5.2 to 1 | | 21 | `#ed4b00` | `oklch(63.50% 0.2079 37.98)` | Kimchi | black, 5.5 to 1 | | 22 | `#f15300` | `oklch(65.09% 0.2060 39.60)` | Cigarette Glow | black, 5.9 to 1 | | 23 | `#f45c00` | `oklch(66.65% 0.2025 41.65)` | Scarlet Ibis | black, 6.3 to 1 | | 24 | `#f76400` | `oklch(68.18% 0.1980 44.11)` | Light My Fire | black, 6.8 to 1 | | 25 | `#f96d00` | `oklch(69.68% 0.1932 46.85)` | Spooky Tangerine | black, 7.2 to 1 | | 26 | `#fb7600` | `oklch(71.12% 0.1887 49.76)` | Butternut Squash | black, 7.6 to 1 | | 27 | `#fc7e00` | `oklch(72.49% 0.1846 52.73)` | Pumpkin Orange | black, 8.1 to 1 | | 28 | `#fd8500` | `oklch(73.76% 0.1813 55.64)` | The New Black | black, 8.5 to 1 | | 29 | `#fe8c00` | `oklch(74.93% 0.1786 58.38)` | Sun Crete | black, 8.9 to 1 | | 30 | `#ff9207` | `oklch(75.96% 0.1755 60.84)` | Tangerine | black, 9.3 to 1 | | 31 | `#ff9713` | `oklch(76.84% 0.1720 62.88)` | Cheese Please | black, 9.6 to 1 | | 32 | `#ff9b19` | `oklch(77.56% 0.1695 64.40)` | Hephaestus Gold | black, 9.9 to 1 | ## CSS ```css background: linear-gradient(135deg, #500100 0.0%, #540100 3.2%, #5a0100 6.5%, #610100 9.7%, #690100 12.9%, #720100 16.1%, #7b0200 19.4%, #840300 22.6%, #8e0500 25.8%, #970800 29.0%, #9f0d00 32.3%, #a81200 35.5%, #b01800 38.7%, #b81d00 41.9%, #c12300 45.2%, #c92902 48.4%, #d12f03 51.6%, #d93603 54.8%, #e03d03 58.1%, #e74402 61.3%, #ed4b00 64.5%, #f15300 67.7%, #f45c00 71.0%, #f76400 74.2%, #f96d00 77.4%, #fb7600 80.6%, #fc7e00 83.9%, #fd8500 87.1%, #fe8c00 90.3%, #ff9207 93.5%, #ff9713 96.8%, #ff9b19 100.0%); background: linear-gradient(135deg in oklch, oklch(27.17% 0.1102 29.53) 0.0%, oklch(28.20% 0.1144 29.56) 3.2%, oklch(29.51% 0.1200 29.53) 6.5%, oklch(31.07% 0.1267 29.43) 9.7%, oklch(32.81% 0.1340 29.40) 12.9%, oklch(34.69% 0.1416 29.42) 16.1%, oklch(36.68% 0.1494 29.48) 19.4%, oklch(38.71% 0.1572 29.58) 22.6%, oklch(40.75% 0.1646 29.76) 25.8%, oklch(42.75% 0.1713 30.02) 29.0%, oklch(44.67% 0.1771 30.39) 32.3%, oklch(46.50% 0.1820 30.84) 35.5%, oklch(48.39% 0.1869 31.31) 38.7%, oklch(50.33% 0.1918 31.79) 41.9%, oklch(52.29% 0.1961 32.35) 45.2%, oklch(54.26% 0.1996 32.96) 48.4%, oklch(56.22% 0.2025 33.66) 51.6%, oklch(58.14% 0.2049 34.49) 54.8%, oklch(60.01% 0.2067 35.48) 58.1%, oklch(61.80% 0.2078 36.64) 61.3%, oklch(63.50% 0.2079 37.98) 64.5%, oklch(65.09% 0.2060 39.60) 67.7%, oklch(66.65% 0.2025 41.65) 71.0%, oklch(68.18% 0.1980 44.11) 74.2%, oklch(69.68% 0.1932 46.85) 77.4%, oklch(71.12% 0.1887 49.76) 80.6%, oklch(72.49% 0.1846 52.73) 83.9%, oklch(73.76% 0.1813 55.64) 87.1%, oklch(74.93% 0.1786 58.38) 90.3%, oklch(75.96% 0.1755 60.84) 93.5%, oklch(76.84% 0.1720 62.88) 96.8%, oklch(77.56% 0.1695 64.40) 100.0%); ``` ## Keyframes 4 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees. | Keyframe | Lightness | Chroma | Hue | | --- | --- | --- | --- | | 1 | 0.272 | 0.11 | 29.5 | | 2 | 0.453 | 0.181 | 30.6 | | 3 | 0.646 | 0.208 | 39 | | 4 | 0.776 | 0.169 | 64.4 | ## In these collections - [Diwali swatches](https://grabient.com/diwali-swatches) - [Persimmon gradients](https://grabient.com/persimmon-gradients) ## Other forms - [JSON](https://grabient.com/kURVAVOcHAFJLwPivcLg.json?steps=32&angle=135) - [PNG](https://grabient.com/kURVAVOcHAFJLwPivcLg.png?steps=32&angle=135) - [SVG](https://grabient.com/kURVAVOcHAFJLwPivcLg.svg?steps=32&angle=135) - [CSS](https://grabient.com/kURVAVOcHAFJLwPivcLg.css?steps=32&angle=135) - [ASE](https://grabient.com/kURVAVOcHAFJLwPivcLg.ase?steps=32&angle=135) - [GPL](https://grabient.com/kURVAVOcHAFJLwPivcLg.gpl?steps=32&angle=135) - [GRD](https://grabient.com/kURVAVOcHAFJLwPivcLg.grd?steps=32&angle=135) - [Design tokens](https://grabient.com/kURVAVOcHAFJLwPivcLg.tokens.json?steps=32&angle=135) - [Social card](https://grabient.com/api/og?seed=kURVAVOcHAFJLwPivcLg&steps=32&angle=135) - [Palettes like this one](https://grabient.com/palettes?q=kURVAVOcHAFJLwPivcLg) - [Guide for agents](https://grabient.com/llms.txt)