# Neon peach, salmon and orange linear swatches

Neon peach, salmon and orange linear swatches with 6 colors: #feaf7c, #ff997d, #ff8162, #ff6a35, #fe5600, #fd4500. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW0FMmYjE9lvAwHWzUA09Q_Y`
- Page: https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y?style=linearSwatches&steps=6&angle=270
- Drawn as: linear swatches, 6 steps, 270 degrees
- Kinds: vivid, neon, warm
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.9 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 | `#feaf7c` | `oklch(81.89% 0.1144 53.44)` | Peach | black, 11.6 to 1 |
| 2 | `#ff997d` | `oklch(78.21% 0.1292 36.14)` | Vivid Tangerine | black, 10 to 1 |
| 3 | `#ff8162` | `oklch(74.03% 0.1602 34.88)` | Pink Fire | black, 8.5 to 1 |
| 4 | `#ff6a35` | `oklch(70.31% 0.1929 38.89)` | Smashed Pumpkin | black, 7.3 to 1 |
| 5 | `#fe5600` | `oklch(67.50% 0.2155 39.17)` | Mystic Red | black, 6.5 to 1 |
| 6 | `#fd4500` | `oklch(65.75% 0.2281 35.45)` | Orange Red | black, 6 to 1 |

## CSS

```css
background: linear-gradient(270deg, #feaf7c 0.000% 16.667%, #ff997d 16.667% 33.333%, #ff8162 33.333% 50.000%, #ff6a35 50.000% 66.667%, #fe5600 66.667% 83.333%, #fd4500 83.333% 100.000%);
background: linear-gradient(270deg, oklch(81.89% 0.1144 53.44) 0.000% 16.667%, oklch(78.21% 0.1292 36.14) 16.667% 33.333%, oklch(74.03% 0.1602 34.88) 33.333% 50.000%, oklch(70.31% 0.1929 38.89) 50.000% 66.667%, oklch(67.50% 0.2155 39.17) 66.667% 83.333%, oklch(65.75% 0.2281 35.45) 83.333% 100.000%);
```

## Keyframes

5 OKLCH keyframes joined by a Catmull-Rom spline. Hue is unwrapped degrees.

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.819 | 0.114 | 53.4 |
| 2 | 0.772 | 0.135 | 33.4 |
| 3 | 0.72 | 0.178 | 37.6 |
| 4 | 0.681 | 0.212 | 39.7 |
| 5 | 0.657 | 0.231 | 35.5 |

## Other forms

- [JSON](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.json?style=linearSwatches&steps=6&angle=270)
- [PNG](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.png?style=linearSwatches&steps=6&angle=270)
- [SVG](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.svg?style=linearSwatches&steps=6&angle=270)
- [CSS](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.css?style=linearSwatches&steps=6&angle=270)
- [ASE](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.ase?style=linearSwatches&steps=6&angle=270)
- [GPL](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.gpl?style=linearSwatches&steps=6&angle=270)
- [GRD](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.grd?style=linearSwatches&steps=6&angle=270)
- [Design tokens](https://grabient.com/kW0FMmYjE9lvAwHWzUA09Q_Y.tokens.json?style=linearSwatches&steps=6&angle=270)
- [Social card](https://grabient.com/api/og?seed=kW0FMmYjE9lvAwHWzUA09Q_Y&style=linearSwatches&steps=6&angle=270)
- [Palettes like this one](https://grabient.com/palettes?q=kW0FMmYjE9lvAwHWzUA09Q_Y)
- [Guide for agents](https://grabient.com/llms.txt)