# Monochrome navy and blue radial swatches

Monochrome navy and blue radial swatches with 32 colors: #101b34, #15223d, #1c2c49, #243858, #2d4669, #36537a, #3e6089, #436a96, #45709f, #4473a4, #4172a6, #3c70a6, #366ca5, #2f67a2, #29629f, #245d9d, #20599a, #1d5697, #1a5194, #174d8f, #15498b, #144486, #124081, #113c7b, #113775, #10336e, #102e66, #0f2a5e, #0e2656, #0e2250, #0d1f4a, #0c1d46. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWOiW8Q5--burwCuKsCHx1Ag`
- Page: https://grabient.com/kWOiW8Q5--burwCuKsCHx1Ag?style=radialSwatches&steps=32&angle=0
- Drawn as: radial swatches, 32 steps, 0 degrees
- Kinds: light center, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 3.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 | `#101b34` | `oklch(22.83% 0.0510 264.37)` | Trapped Darkness | white, 17 to 1 |
| 2 | `#15223d` | `oklch(25.53% 0.0539 263.25)` | Cool Balaclavas Are Forever | white, 15.8 to 1 |
| 3 | `#1c2c49` | `oklch(29.41% 0.0578 261.64)` | Rurikon Blue | white, 13.9 to 1 |
| 4 | `#243858` | `oklch(34.05% 0.0624 259.71)` | Navy Peony | white, 11.7 to 1 |
| 5 | `#2d4669` | `oklch(39.01% 0.0675 257.64)` | Commodore | white, 9.6 to 1 |
| 6 | `#36537a` | `oklch(43.87% 0.0728 255.62)` | Bunting Blue | white, 7.8 to 1 |
| 7 | `#3e6089` | `oklch(48.18% 0.0782 253.81)` | Functional Blue | white, 6.4 to 1 |
| 8 | `#436a96` | `oklch(51.53% 0.0833 252.39)` | Queen Blue | white, 5.6 to 1 |
| 9 | `#45709f` | `oklch(53.50% 0.0879 251.54)` | Naval | white, 5.1 to 1 |
| 10 | `#4473a4` | `oklch(54.26% 0.0927 251.16)` | Decoration Blue | white, 4.9 to 1 |
| 11 | `#4172a6` | `oklch(54.13% 0.0977 251.13)` | Flat Blue | white, 5 to 1 |
| 12 | `#3c70a6` | `oklch(53.32% 0.1027 251.37)` | Mega Blue | white, 5.1 to 1 |
| 13 | `#366ca5` | `oklch(52.04% 0.1075 251.81)` | Mega Blue | white, 5.4 to 1 |
| 14 | `#2f67a2` | `oklch(50.49% 0.1120 252.37)` | Distant Blue | white, 5.8 to 1 |
| 15 | `#29629f` | `oklch(48.90% 0.1158 252.98)` | Zydeco Blue | white, 6.3 to 1 |
| 16 | `#245d9d` | `oklch(47.45% 0.1188 253.55)` | Drakenhof Nightshade | white, 6.7 to 1 |
| 17 | `#20599a` | `oklch(46.29% 0.1208 254.06)` | Suddenly Sapphire | white, 7 to 1 |
| 18 | `#1d5697` | `oklch(45.08% 0.1221 254.63)` | Florentine Lapis | white, 7.4 to 1 |
| 19 | `#1a5194` | `oklch(43.78% 0.1229 255.28)` | Nautical Blue | white, 7.9 to 1 |
| 20 | `#174d8f` | `oklch(42.41% 0.1230 255.98)` | Dancing Sea | white, 8.3 to 1 |
| 21 | `#15498b` | `oklch(40.98% 0.1225 256.71)` | Lady of the Night | white, 8.9 to 1 |
| 22 | `#144486` | `oklch(39.52% 0.1215 257.46)` | Poster Blue | white, 9.5 to 1 |
| 23 | `#124081` | `oklch(38.05% 0.1199 258.20)` | Bracing Blue | white, 10.1 to 1 |
| 24 | `#113c7b` | `oklch(36.58% 0.1178 258.92)` | Azure Dragon | white, 10.7 to 1 |
| 25 | `#113775` | `oklch(35.07% 0.1147 259.62)` | Azure Dragon | white, 11.4 to 1 |
| 26 | `#10336e` | `oklch(33.40% 0.1103 260.39)` | Atlantic Navy | white, 12.2 to 1 |
| 27 | `#102e66` | `oklch(31.64% 0.1050 261.18)` | Cool Black | white, 13 to 1 |
| 28 | `#0f2a5e` | `oklch(29.87% 0.0991 261.97)` | Blue Leviathan | white, 13.8 to 1 |
| 29 | `#0e2656` | `oklch(28.18% 0.0932 262.71)` | Fibonacci Blue | white, 14.6 to 1 |
| 30 | `#0e2250` | `oklch(26.65% 0.0877 263.39)` | Dark Soul | white, 15.4 to 1 |
| 31 | `#0d1f4a` | `oklch(25.36% 0.0832 263.95)` | Oxford Blue | white, 15.9 to 1 |
| 32 | `#0c1d46` | `oklch(24.41% 0.0799 264.38)` | Oxford Blue | white, 16.4 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #101b34 0.000% 3.125%, #15223d 3.125% 6.250%, #1c2c49 6.250% 9.375%, #243858 9.375% 12.500%, #2d4669 12.500% 15.625%, #36537a 15.625% 18.750%, #3e6089 18.750% 21.875%, #436a96 21.875% 25.000%, #45709f 25.000% 28.125%, #4473a4 28.125% 31.250%, #4172a6 31.250% 34.375%, #3c70a6 34.375% 37.500%, #366ca5 37.500% 40.625%, #2f67a2 40.625% 43.750%, #29629f 43.750% 46.875%, #245d9d 46.875% 50.000%, #20599a 50.000% 53.125%, #1d5697 53.125% 56.250%, #1a5194 56.250% 59.375%, #174d8f 59.375% 62.500%, #15498b 62.500% 65.625%, #144486 65.625% 68.750%, #124081 68.750% 71.875%, #113c7b 71.875% 75.000%, #113775 75.000% 78.125%, #10336e 78.125% 81.250%, #102e66 81.250% 84.375%, #0f2a5e 84.375% 87.500%, #0e2656 87.500% 90.625%, #0e2250 90.625% 93.750%, #0d1f4a 93.750% 96.875%, #0c1d46 96.875% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(22.83% 0.0510 264.37) 0.000% 3.125%, oklch(25.53% 0.0539 263.25) 3.125% 6.250%, oklch(29.41% 0.0578 261.64) 6.250% 9.375%, oklch(34.05% 0.0624 259.71) 9.375% 12.500%, oklch(39.01% 0.0675 257.64) 12.500% 15.625%, oklch(43.87% 0.0728 255.62) 15.625% 18.750%, oklch(48.18% 0.0782 253.81) 18.750% 21.875%, oklch(51.53% 0.0833 252.39) 21.875% 25.000%, oklch(53.50% 0.0879 251.54) 25.000% 28.125%, oklch(54.26% 0.0927 251.16) 28.125% 31.250%, oklch(54.13% 0.0977 251.13) 31.250% 34.375%, oklch(53.32% 0.1027 251.37) 34.375% 37.500%, oklch(52.04% 0.1075 251.81) 37.500% 40.625%, oklch(50.49% 0.1120 252.37) 40.625% 43.750%, oklch(48.90% 0.1158 252.98) 43.750% 46.875%, oklch(47.45% 0.1188 253.55) 46.875% 50.000%, oklch(46.29% 0.1208 254.06) 50.000% 53.125%, oklch(45.08% 0.1221 254.63) 53.125% 56.250%, oklch(43.78% 0.1229 255.28) 56.250% 59.375%, oklch(42.41% 0.1230 255.98) 59.375% 62.500%, oklch(40.98% 0.1225 256.71) 62.500% 65.625%, oklch(39.52% 0.1215 257.46) 65.625% 68.750%, oklch(38.05% 0.1199 258.20) 68.750% 71.875%, oklch(36.58% 0.1178 258.92) 71.875% 75.000%, oklch(35.07% 0.1147 259.62) 75.000% 78.125%, oklch(33.40% 0.1103 260.39) 78.125% 81.250%, oklch(31.64% 0.1050 261.18) 81.250% 84.375%, oklch(29.87% 0.0991 261.97) 84.375% 87.500%, oklch(28.18% 0.0932 262.71) 87.500% 90.625%, oklch(26.65% 0.0877 263.39) 90.625% 93.750%, oklch(25.36% 0.0832 263.95) 93.750% 96.875%, oklch(24.41% 0.0799 264.38) 96.875% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.228 | 0.051 | 264.4 |
| 2 | 0.531 | 0.087 | 251.7 |
| 3 | 0.469 | 0.12 | 253.8 |
| 4 | 0.362 | 0.117 | 259.1 |
| 5 | 0.244 | 0.08 | 264.4 |

## In these collections

- [Dark gradients](https://grabient.com/dark-gradients)
- [Cool blue](https://grabient.com/cool-blue)

## Other forms

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