# Navy and aubergine text palette

The Navy and aubergine text palette brings together blue, purple, and magenta. The colors span a narrow lightness range, combining moderate color with gentle contrast. Its dark and grounded character suits website sections and interface mockups. Its darkest tone is blue, and its lightest tone is magenta.

- Also called: Analogous navy to purple radial gradient
- Seed: `kSTlO8KqtDbGwRM`
- Page: https://grabient.com/kSTlO8KqtDbGwRM?style=radialGradient&steps=32
- Drawn as: radial gradient, 32 steps, 90 degrees
- Kinds: even lightness, dark
- Hues: analogous
- Contrast of its darkest and lightest colors: 1.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 | `#112968` | `oklch(30.71% 0.1144 264.38)` | Old Glory Blue | white, 13.5 to 1 |
| 2 | `#132968` | `oklch(30.80% 0.1145 265.43)` | Schiava Blue | white, 13.5 to 1 |
| 3 | `#162969` | `oklch(30.91% 0.1146 266.66)` | Schiava Blue | white, 13.5 to 1 |
| 4 | `#182969` | `oklch(31.03% 0.1148 268.06)` | Schiava Blue | white, 13.4 to 1 |
| 5 | `#1b286a` | `oklch(31.16% 0.1149 269.62)` | After Work Blue | white, 13.4 to 1 |
| 6 | `#1e286a` | `oklch(31.30% 0.1151 271.32)` | After Work Blue | white, 13.3 to 1 |
| 7 | `#21286a` | `oklch(31.45% 0.1152 273.14)` | After Work Blue | white, 13.3 to 1 |
| 8 | `#24276b` | `oklch(31.61% 0.1154 275.08)` | After Work Blue | white, 13.2 to 1 |
| 9 | `#26276b` | `oklch(31.79% 0.1156 277.11)` | After Work Blue | white, 13.2 to 1 |
| 10 | `#29276b` | `oklch(31.97% 0.1159 279.22)` | After Work Blue | white, 13.1 to 1 |
| 11 | `#2c266c` | `oklch(32.17% 0.1162 281.40)` | After Work Blue | white, 13 to 1 |
| 12 | `#2f266c` | `oklch(32.38% 0.1165 283.64)` | Dark Dreams | white, 13 to 1 |
| 13 | `#32266c` | `oklch(32.60% 0.1168 285.91)` | Dark Dreams | white, 12.9 to 1 |
| 14 | `#35256c` | `oklch(32.83% 0.1172 288.21)` | Dark Dreams | white, 12.8 to 1 |
| 15 | `#38256c` | `oklch(33.08% 0.1177 290.52)` | Dark Dreams | white, 12.7 to 1 |
| 16 | `#3a256c` | `oklch(33.33% 0.1182 292.82)` | Dark Dreams | white, 12.6 to 1 |
| 17 | `#3d256c` | `oklch(33.60% 0.1188 295.14)` | Fading Horizon | white, 12.5 to 1 |
| 18 | `#40246c` | `oklch(33.91% 0.1195 297.67)` | Fading Horizon | white, 12.4 to 1 |
| 19 | `#44246c` | `oklch(34.26% 0.1203 300.40)` | Fading Horizon | white, 12.2 to 1 |
| 20 | `#47246c` | `oklch(34.63% 0.1212 303.30)` | Fading Horizon | white, 12.1 to 1 |
| 21 | `#4b236b` | `oklch(35.03% 0.1222 306.31)` | Fading Horizon | white, 11.9 to 1 |
| 22 | `#4f236b` | `oklch(35.44% 0.1232 309.40)` | Elegant Purple Gown | white, 11.7 to 1 |
| 23 | `#52236a` | `oklch(35.86% 0.1243 312.53)` | Elegant Purple Gown | white, 11.6 to 1 |
| 24 | `#562369` | `oklch(36.29% 0.1254 315.65)` | Elegant Purple Gown | white, 11.4 to 1 |
| 25 | `#5a2268` | `oklch(36.71% 0.1265 318.71)` | Elegant Purple Gown | white, 11.2 to 1 |
| 26 | `#5d2267` | `oklch(37.12% 0.1275 321.69)` | Violethargic | white, 11 to 1 |
| 27 | `#612266` | `oklch(37.51% 0.1285 324.52)` | Blackest Berry | white, 10.9 to 1 |
| 28 | `#642165` | `oklch(37.88% 0.1295 327.18)` | Blackest Berry | white, 10.7 to 1 |
| 29 | `#672163` | `oklch(38.21% 0.1303 329.62)` | Blackest Berry | white, 10.6 to 1 |
| 30 | `#692162` | `oklch(38.51% 0.1311 331.79)` | Blackest Berry | white, 10.5 to 1 |
| 31 | `#6b2161` | `oklch(38.77% 0.1318 333.66)` | Blackest Berry | white, 10.4 to 1 |
| 32 | `#6d2160` | `oklch(38.98% 0.1323 335.18)` | Palatinate Purple | white, 10.3 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #112968 0.0%, #132968 3.2%, #162969 6.5%, #182969 9.7%, #1b286a 12.9%, #1e286a 16.1%, #21286a 19.4%, #24276b 22.6%, #26276b 25.8%, #29276b 29.0%, #2c266c 32.3%, #2f266c 35.5%, #32266c 38.7%, #35256c 41.9%, #38256c 45.2%, #3a256c 48.4%, #3d256c 51.6%, #40246c 54.8%, #44246c 58.1%, #47246c 61.3%, #4b236b 64.5%, #4f236b 67.7%, #52236a 71.0%, #562369 74.2%, #5a2268 77.4%, #5d2267 80.6%, #612266 83.9%, #642165 87.1%, #672163 90.3%, #692162 93.5%, #6b2161 96.8%, #6d2160 100.0%);
background: radial-gradient(circle at 50% 50% in oklch, oklch(30.71% 0.1144 264.38) 0.0%, oklch(30.80% 0.1145 265.43) 3.2%, oklch(30.91% 0.1146 266.66) 6.5%, oklch(31.03% 0.1148 268.06) 9.7%, oklch(31.16% 0.1149 269.62) 12.9%, oklch(31.30% 0.1151 271.32) 16.1%, oklch(31.45% 0.1152 273.14) 19.4%, oklch(31.61% 0.1154 275.08) 22.6%, oklch(31.79% 0.1156 277.11) 25.8%, oklch(31.97% 0.1159 279.22) 29.0%, oklch(32.17% 0.1162 281.40) 32.3%, oklch(32.38% 0.1165 283.64) 35.5%, oklch(32.60% 0.1168 285.91) 38.7%, oklch(32.83% 0.1172 288.21) 41.9%, oklch(33.08% 0.1177 290.52) 45.2%, oklch(33.33% 0.1182 292.82) 48.4%, oklch(33.60% 0.1188 295.14) 51.6%, oklch(33.91% 0.1195 297.67) 54.8%, oklch(34.26% 0.1203 300.40) 58.1%, oklch(34.63% 0.1212 303.30) 61.3%, oklch(35.03% 0.1222 306.31) 64.5%, oklch(35.44% 0.1232 309.40) 67.7%, oklch(35.86% 0.1243 312.53) 71.0%, oklch(36.29% 0.1254 315.65) 74.2%, oklch(36.71% 0.1265 318.71) 77.4%, oklch(37.12% 0.1275 321.69) 80.6%, oklch(37.51% 0.1285 324.52) 83.9%, oklch(37.88% 0.1295 327.18) 87.1%, oklch(38.21% 0.1303 329.62) 90.3%, oklch(38.51% 0.1311 331.79) 93.5%, oklch(38.77% 0.1318 333.66) 96.8%, oklch(38.98% 0.1323 335.18) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.307 | 0.114 | 264.4 |
| 2 | 0.335 | 0.119 | 294 |
| 3 | 0.39 | 0.132 | 335.2 |

## In these collections

- [Text gradients](https://grabient.com/text-gradients)

## Other forms

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