# Blue, pink, light pink and gray linear gradient

Blue, pink, light pink and gray linear gradient with 7 colors: #066fd8, #a345b9, #da4a4a, #faa795, #f8e2e0, #a69998, #5a4847. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kUjIO1zcHPPYJP-1iT_g`
- Page: https://grabient.com/kUjIO1zcHPPYJP-1iT_g
- Drawn as: linear gradient, 7 steps, 90 degrees
- Kinds: light center, vivid, warm
- Hues: wide
- Contrast of its darkest and lightest colors: 6.8 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 | `#066fd8` | `oklch(55.12% 0.1805 255.23)` | Flickr Blue | white, 4.9 to 1 |
| 2 | `#a345b9` | `oklch(56.08% 0.1902 319.70)` | Fuchsia Pheromone | white, 5.1 to 1 |
| 3 | `#da4a4a` | `oklch(61.02% 0.1805 24.16)` | Re-Entry | black, 5 to 1 |
| 4 | `#faa795` | `oklch(80.51% 0.1027 32.22)` | Au Contraire | black, 11 to 1 |
| 5 | `#f8e2e0` | `oklch(92.91% 0.0248 24.16)` | Delicacy | black, 16.8 to 1 |
| 6 | `#a69998` | `oklch(69.51% 0.0151 24.16)` | Trillium | black, 7.6 to 1 |
| 7 | `#5a4847` | `oklch(42.13% 0.0248 24.16)` | Wild Boysenberry | white, 8.5 to 1 |

## CSS

```css
background: linear-gradient(90deg, #066fd8 0.0%, #a345b9 16.7%, #da4a4a 33.3%, #faa795 50.0%, #f8e2e0 66.7%, #a69998 83.3%, #5a4847 100.0%);
background: linear-gradient(90deg in oklch, oklch(55.12% 0.1805 255.23) 0.0%, oklch(56.08% 0.1902 319.70) 16.7%, oklch(61.02% 0.1805 24.16) 33.3%, oklch(80.51% 0.1027 32.22) 50.0%, oklch(92.91% 0.0248 24.16) 66.7%, oklch(69.51% 0.0151 24.16) 83.3%, oklch(42.13% 0.0248 24.16) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.551 | 0.181 | 255.2 |
| 2 | 0.61 | 0.181 | 384.2 |
| 3 | 0.929 | 0.025 | 384.2 |
| 4 | 0.421 | 0.025 | 384.2 |

## In these collections

- [Back to school swatches](https://grabient.com/back-to-school-swatches)

## Other forms

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