# Blue and aubergine color palette

The Blue and aubergine color palette brings together dark blue, blue, and dark purple. The colors span a moderate lightness range, combining strong color with clear contrast. Its balanced and composed character suits brand mood boards and editorial graphics. Its darkest tone is dark blue, and its lightest tone is blue.

- Also called: Analogous navy, blue and purple radial gradient
- Seed: `kSR0nHUtBBCYoQQ`
- Page: https://grabient.com/kSR0nHUtBBCYoQQ?style=radialGradient&steps=32&angle=45
- Drawn as: radial gradient, 32 steps, 45 degrees
- Kinds: light center, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 4.2 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 | `#211f58` | `oklch(27.95% 0.1006 279.84)` | Spacescape | white, 15 to 1 |
| 2 | `#25225f` | `oklch(29.44% 0.1054 280.19)` | Intergalactic Cowboy | white, 14.3 to 1 |
| 3 | `#2a2668` | `oklch(31.44% 0.1119 280.61)` | Indie Go | white, 13.3 to 1 |
| 4 | `#302b73` | `oklch(33.87% 0.1197 281.09)` | Blue Rose | white, 12.2 to 1 |
| 5 | `#37307f` | `oklch(36.65% 0.1287 281.62)` | Ballpoint Indigo | white, 11 to 1 |
| 6 | `#3f378e` | `oklch(39.69% 0.1385 282.21)` | Majestic Eggplant | white, 9.8 to 1 |
| 7 | `#483e9d` | `oklch(42.90% 0.1488 282.83)` | Blueberry | white, 8.6 to 1 |
| 8 | `#5145ad` | `oklch(46.18% 0.1595 283.49)` | Swiss Plum | white, 7.5 to 1 |
| 9 | `#5b4cbd` | `oklch(49.46% 0.1701 284.18)` | Swiss Plum | white, 6.5 to 1 |
| 10 | `#6453cc` | `oklch(52.64% 0.1803 284.88)` | Circumorbital Ring | white, 5.7 to 1 |
| 11 | `#6e5adb` | `oklch(55.65% 0.1901 285.59)` | Astro Purple | white, 5 to 1 |
| 12 | `#7760e9` | `oklch(58.38% 0.1989 286.31)` | Medium Slate Blue | black, 4.6 to 1 |
| 13 | `#7f65f5` | `oklch(60.75% 0.2066 287.02)` | Medium Slate Blue | black, 5 to 1 |
| 14 | `#8669ff` | `oklch(62.68% 0.2129 287.72)` | Purple Anemone | black, 5.4 to 1 |
| 15 | `#8b6fff` | `oklch(64.07% 0.2056 288.40)` | Blackthorn Berry | black, 5.8 to 1 |
| 16 | `#8f72ff` | `oklch(64.84% 0.2015 289.04)` | Blackthorn Berry | black, 5.9 to 1 |
| 17 | `#9071ff` | `oklch(64.90% 0.2019 289.67)` | Blackthorn Berry | black, 6 to 1 |
| 18 | `#906dff` | `oklch(64.26% 0.2071 290.32)` | Blackthorn Berry | black, 5.8 to 1 |
| 19 | `#8e67fe` | `oklch(63.01% 0.2145 290.99)` | Purple Anemone | black, 5.5 to 1 |
| 20 | `#8a62f4` | `oklch(61.23% 0.2090 291.69)` | Purple Anemone | black, 5.1 to 1 |
| 21 | `#855ce8` | `oklch(59.01% 0.2020 292.40)` | Gloomy Purple | black, 4.6 to 1 |
| 22 | `#7e56db` | `oklch(56.42% 0.1939 293.12)` | Gloomy Purple | white, 4.9 to 1 |
| 23 | `#764fcc` | `oklch(53.57% 0.1849 293.83)` | Aconite Purple | white, 5.5 to 1 |
| 24 | `#6e48bc` | `oklch(50.53% 0.1753 294.53)` | Purple Rain | white, 6.3 to 1 |
| 25 | `#6640ad` | `oklch(47.40% 0.1654 295.22)` | Poppy Pompadour | white, 7.2 to 1 |
| 26 | `#5d399d` | `oklch(44.25% 0.1555 295.88)` | Ruthless Empress | white, 8.2 to 1 |
| 27 | `#55328f` | `oklch(41.17% 0.1457 296.50)` | Blue Magenta Violet | white, 9.3 to 1 |
| 28 | `#4d2c81` | `oklch(38.25% 0.1365 297.09)` | Spanish Violet | white, 10.5 to 1 |
| 29 | `#452775` | `oklch(35.59% 0.1281 297.62)` | Windsor | white, 11.6 to 1 |
| 30 | `#3f226a` | `oklch(33.25% 0.1207 298.10)` | Fading Horizon | white, 12.7 to 1 |
| 31 | `#3a1e62` | `oklch(31.33% 0.1147 298.52)` | Christalle | white, 13.6 to 1 |
| 32 | `#361b5c` | `oklch(29.92% 0.1102 298.87)` | Fabric of Space | white, 14.2 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #211f58 0.0%, #25225f 3.2%, #2a2668 6.5%, #302b73 9.7%, #37307f 12.9%, #3f378e 16.1%, #483e9d 19.4%, #5145ad 22.6%, #5b4cbd 25.8%, #6453cc 29.0%, #6e5adb 32.3%, #7760e9 35.5%, #7f65f5 38.7%, #8669ff 41.9%, #8b6fff 45.2%, #8f72ff 48.4%, #9071ff 51.6%, #906dff 54.8%, #8e67fe 58.1%, #8a62f4 61.3%, #855ce8 64.5%, #7e56db 67.7%, #764fcc 71.0%, #6e48bc 74.2%, #6640ad 77.4%, #5d399d 80.6%, #55328f 83.9%, #4d2c81 87.1%, #452775 90.3%, #3f226a 93.5%, #3a1e62 96.8%, #361b5c 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(27.95% 0.1006 279.84) 0.0%, oklch(29.44% 0.1054 280.19) 3.2%, oklch(31.44% 0.1119 280.61) 6.5%, oklch(33.87% 0.1197 281.09) 9.7%, oklch(36.65% 0.1287 281.62) 12.9%, oklch(39.69% 0.1385 282.21) 16.1%, oklch(42.90% 0.1488 282.83) 19.4%, oklch(46.18% 0.1595 283.49) 22.6%, oklch(49.46% 0.1701 284.18) 25.8%, oklch(52.64% 0.1803 284.88) 29.0%, oklch(55.65% 0.1901 285.59) 32.3%, oklch(58.38% 0.1989 286.31) 35.5%, oklch(60.75% 0.2066 287.02) 38.7%, oklch(62.68% 0.2129 287.72) 41.9%, oklch(64.07% 0.2056 288.40) 45.2%, oklch(64.84% 0.2015 289.04) 48.4%, oklch(64.90% 0.2019 289.67) 51.6%, oklch(64.26% 0.2071 290.32) 54.8%, oklch(63.01% 0.2145 290.99) 58.1%, oklch(61.23% 0.2090 291.69) 61.3%, oklch(59.01% 0.2020 292.40) 64.5%, oklch(56.42% 0.1939 293.12) 67.7%, oklch(53.57% 0.1849 293.83) 71.0%, oklch(50.53% 0.1753 294.53) 74.2%, oklch(47.40% 0.1654 295.22) 77.4%, oklch(44.25% 0.1555 295.88) 80.6%, oklch(41.17% 0.1457 296.50) 83.9%, oklch(38.25% 0.1365 297.09) 87.1%, oklch(35.59% 0.1281 297.62) 90.3%, oklch(33.25% 0.1207 298.10) 93.5%, oklch(31.33% 0.1147 298.52) 96.8%, oklch(29.92% 0.1102 298.87) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.28 | 0.101 | 279.8 |
| 2 | 0.65 | 0.22 | 289.4 |
| 3 | 0.299 | 0.11 | 298.9 |

## In these collections

- [Indigo gradients](https://grabient.com/indigo-gradients)
- [Purple gradients](https://grabient.com/purple-gradients)

## Other forms

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