# Blue and violet deep sea palette

This palette brings together dark blue and purple. It lightens and then darkens across a moderate lightness range, combining strong color with clear contrast. Its dark and grounded character suits travel posters and environmental mood boards, especially compositions that need a controlled shift between darker and lighter areas.

- Also called: Analogous navy and purple angular gradient
- Seed: `kSQDrDycjCRcOvi`
- Page: https://grabient.com/kSQDrDycjCRcOvi?style=angularGradient&steps=48&angle=30
- Drawn as: angular gradient, 48 steps, 30 degrees
- Kinds: light center, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 4 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 | `#181c48` | `oklch(25.20% 0.0799 274.92)` | Konkikyō Blue | white, 16.1 to 1 |
| 2 | `#1a1e4b` | `oklch(26.01% 0.0829 275.41)` | Fly-by-Night | white, 15.7 to 1 |
| 3 | `#1d2050` | `oklch(27.05% 0.0868 276.03)` | Fly-by-Night | white, 15.3 to 1 |
| 4 | `#202255` | `oklch(28.30% 0.0914 276.76)` | Spacescape | white, 14.7 to 1 |
| 5 | `#23255c` | `oklch(29.71% 0.0967 277.58)` | Deep Breath | white, 14.1 to 1 |
| 6 | `#272863` | `oklch(31.29% 0.1025 278.49)` | Deep Breath | white, 13.3 to 1 |
| 7 | `#2c2b6b` | `oklch(32.98% 0.1088 279.47)` | Blue Rose | white, 12.6 to 1 |
| 8 | `#312e74` | `oklch(34.79% 0.1155 280.51)` | Blue Rose | white, 11.8 to 1 |
| 9 | `#37327c` | `oklch(36.67% 0.1225 281.60)` | Ballpoint Indigo | white, 11 to 1 |
| 10 | `#3d3586` | `oklch(38.61% 0.1298 282.73)` | Majestic Eggplant | white, 10.2 to 1 |
| 11 | `#43398f` | `oklch(40.58% 0.1371 283.87)` | Nauseous Blue | white, 9.4 to 1 |
| 12 | `#4a3d99` | `oklch(42.55% 0.1444 285.02)` | Blueberry | white, 8.7 to 1 |
| 13 | `#5140a2` | `oklch(44.51% 0.1517 286.17)` | Megadrive Screen | white, 8 to 1 |
| 14 | `#5744ab` | `oklch(46.42% 0.1587 287.30)` | Swiss Plum | white, 7.4 to 1 |
| 15 | `#5e47b4` | `oklch(48.27% 0.1656 288.41)` | Swiss Plum | white, 6.9 to 1 |
| 16 | `#654abd` | `oklch(50.03% 0.1720 289.47)` | Waiporoporo Purple | white, 6.4 to 1 |
| 17 | `#6b4dc4` | `oklch(51.67% 0.1781 290.48)` | Waiporoporo Purple | white, 6 to 1 |
| 18 | `#714fcc` | `oklch(53.17% 0.1836 291.41)` | Aconite Purple | white, 5.6 to 1 |
| 19 | `#7752d2` | `oklch(54.51% 0.1884 292.27)` | Aconite Purple | white, 5.3 to 1 |
| 20 | `#7c54d7` | `oklch(55.67% 0.1926 293.04)` | Gloomy Purple | white, 5.1 to 1 |
| 21 | `#8055dc` | `oklch(56.61% 0.1959 293.70)` | Gloomy Purple | white, 4.9 to 1 |
| 22 | `#8356df` | `oklch(57.31% 0.1983 294.24)` | Gloomy Purple | white, 4.8 to 1 |
| 23 | `#8557e1` | `oklch(57.75% 0.1997 294.66)` | Gloomy Purple | white, 4.7 to 1 |
| 24 | `#8657e1` | `oklch(57.91% 0.2001 294.92)` | Gloomy Purple | white, 4.6 to 1 |
| 25 | `#8657e0` | `oklch(57.76% 0.1992 295.04)` | Gloomy Purple | white, 4.7 to 1 |
| 26 | `#8456de` | `oklch(57.29% 0.1971 295.00)` | Gloomy Purple | white, 4.8 to 1 |
| 27 | `#8155d9` | `oklch(56.52% 0.1939 294.83)` | Gloomy Purple | white, 4.9 to 1 |
| 28 | `#7d53d4` | `oklch(55.48% 0.1896 294.54)` | Astro Purple | white, 5.1 to 1 |
| 29 | `#7951cd` | `oklch(54.20% 0.1843 294.13)` | Fuchsia Blue | white, 5.4 to 1 |
| 30 | `#734ec6` | `oklch(52.71% 0.1782 293.62)` | Purple Rain | white, 5.7 to 1 |
| 31 | `#6d4bbd` | `oklch(51.02% 0.1714 293.02)` | Waiporoporo Purple | white, 6.1 to 1 |
| 32 | `#6648b4` | `oklch(49.16% 0.1639 292.35)` | Swiss Plum | white, 6.6 to 1 |
| 33 | `#5f44aa` | `oklch(47.17% 0.1559 291.60)` | Swiss Plum | white, 7.2 to 1 |
| 34 | `#58409f` | `oklch(45.06% 0.1475 290.80)` | Daisy Bush | white, 7.8 to 1 |
| 35 | `#513c95` | `oklch(42.86% 0.1387 289.96)` | Ruthless Empress | white, 8.6 to 1 |
| 36 | `#4a388a` | `oklch(40.61% 0.1297 289.08)` | Blue Gem | white, 9.4 to 1 |
| 37 | `#42347e` | `oklch(38.31% 0.1205 288.18)` | Galactic Compass | white, 10.3 to 1 |
| 38 | `#3b3073` | `oklch(36.01% 0.1113 287.28)` | Her Highness | white, 11.2 to 1 |
| 39 | `#352c68` | `oklch(33.72% 0.1022 286.37)` | Paris M | white, 12.2 to 1 |
| 40 | `#2e285e` | `oklch(31.47% 0.0932 285.48)` | Paris M | white, 13.3 to 1 |
| 41 | `#292454` | `oklch(29.29% 0.0846 284.61)` | Pāua | white, 14.3 to 1 |
| 42 | `#23204a` | `oklch(27.21% 0.0762 283.78)` | Azulado | white, 15.2 to 1 |
| 43 | `#1e1c42` | `oklch(25.24% 0.0684 283.00)` | Konkikyō Blue | white, 16.1 to 1 |
| 44 | `#1a1939` | `oklch(23.42% 0.0612 282.28)` | Nightwalker | white, 16.9 to 1 |
| 45 | `#161632` | `oklch(21.77% 0.0546 281.62)` | Lost in Sadness | white, 17.5 to 1 |
| 46 | `#13132c` | `oklch(20.32% 0.0488 281.05)` | Liberty Blue | white, 18.1 to 1 |
| 47 | `#111127` | `oklch(19.09% 0.0439 280.58)` | Corbeau | white, 18.5 to 1 |
| 48 | `#0f0f23` | `oklch(18.11% 0.0400 280.21)` | Corbeau | white, 18.8 to 1 |

## CSS

```css
background: conic-gradient(from 30deg, #181c48 0.0%, #1a1e4b 2.1%, #1d2050 4.3%, #202255 6.4%, #23255c 8.5%, #272863 10.6%, #2c2b6b 12.8%, #312e74 14.9%, #37327c 17.0%, #3d3586 19.1%, #43398f 21.3%, #4a3d99 23.4%, #5140a2 25.5%, #5744ab 27.7%, #5e47b4 29.8%, #654abd 31.9%, #6b4dc4 34.0%, #714fcc 36.2%, #7752d2 38.3%, #7c54d7 40.4%, #8055dc 42.6%, #8356df 44.7%, #8557e1 46.8%, #8657e1 48.9%, #8657e0 51.1%, #8456de 53.2%, #8155d9 55.3%, #7d53d4 57.4%, #7951cd 59.6%, #734ec6 61.7%, #6d4bbd 63.8%, #6648b4 66.0%, #5f44aa 68.1%, #58409f 70.2%, #513c95 72.3%, #4a388a 74.5%, #42347e 76.6%, #3b3073 78.7%, #352c68 80.9%, #2e285e 83.0%, #292454 85.1%, #23204a 87.2%, #1e1c42 89.4%, #1a1939 91.5%, #161632 93.6%, #13132c 95.7%, #111127 97.9%, #0f0f23 100.0%);
background: conic-gradient(from 30deg in oklch, oklch(25.20% 0.0799 274.92) 0.0%, oklch(26.01% 0.0829 275.41) 2.1%, oklch(27.05% 0.0868 276.03) 4.3%, oklch(28.30% 0.0914 276.76) 6.4%, oklch(29.71% 0.0967 277.58) 8.5%, oklch(31.29% 0.1025 278.49) 10.6%, oklch(32.98% 0.1088 279.47) 12.8%, oklch(34.79% 0.1155 280.51) 14.9%, oklch(36.67% 0.1225 281.60) 17.0%, oklch(38.61% 0.1298 282.73) 19.1%, oklch(40.58% 0.1371 283.87) 21.3%, oklch(42.55% 0.1444 285.02) 23.4%, oklch(44.51% 0.1517 286.17) 25.5%, oklch(46.42% 0.1587 287.30) 27.7%, oklch(48.27% 0.1656 288.41) 29.8%, oklch(50.03% 0.1720 289.47) 31.9%, oklch(51.67% 0.1781 290.48) 34.0%, oklch(53.17% 0.1836 291.41) 36.2%, oklch(54.51% 0.1884 292.27) 38.3%, oklch(55.67% 0.1926 293.04) 40.4%, oklch(56.61% 0.1959 293.70) 42.6%, oklch(57.31% 0.1983 294.24) 44.7%, oklch(57.75% 0.1997 294.66) 46.8%, oklch(57.91% 0.2001 294.92) 48.9%, oklch(57.76% 0.1992 295.04) 51.1%, oklch(57.29% 0.1971 295.00) 53.2%, oklch(56.52% 0.1939 294.83) 55.3%, oklch(55.48% 0.1896 294.54) 57.4%, oklch(54.20% 0.1843 294.13) 59.6%, oklch(52.71% 0.1782 293.62) 61.7%, oklch(51.02% 0.1714 293.02) 63.8%, oklch(49.16% 0.1639 292.35) 66.0%, oklch(47.17% 0.1559 291.60) 68.1%, oklch(45.06% 0.1475 290.80) 70.2%, oklch(42.86% 0.1387 289.96) 72.3%, oklch(40.61% 0.1297 289.08) 74.5%, oklch(38.31% 0.1205 288.18) 76.6%, oklch(36.01% 0.1113 287.28) 78.7%, oklch(33.72% 0.1022 286.37) 80.9%, oklch(31.47% 0.0932 285.48) 83.0%, oklch(29.29% 0.0846 284.61) 85.1%, oklch(27.21% 0.0762 283.78) 87.2%, oklch(25.24% 0.0684 283.00) 89.4%, oklch(23.42% 0.0612 282.28) 91.5%, oklch(21.77% 0.0546 281.62) 93.6%, oklch(20.32% 0.0488 281.05) 95.7%, oklch(19.09% 0.0439 280.58) 97.9%, oklch(18.11% 0.0400 280.21) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.252 | 0.08 | 274.9 |
| 2 | 0.579 | 0.2 | 295 |
| 3 | 0.181 | 0.04 | 280.2 |

## In these collections

- [Deep sea gradients](https://grabient.com/deep-sea-gradients)

## Other forms

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