# Soft deep blue pale teal gradient

Muted navy and blue linear gradient with 48 colors: #1f3048, #22344c, #253951, #293f57, #2e465e, #344e65, #3a566d, #415f75, #48697e, #507387, #587e91, #61899a, #6993a3, #729ead, #7ba9b5, #83b3be, #8cbcc6, #93c5cd, #9acdd4, #a0d4da, #a5dade, #a9dfe2, #ace2e5, #ade4e7, #ace4e7, #aae2e6, #a6dfe4, #a1dae0, #9ad4dc, #93cdd7, #8bc5d1, #82bbca, #79b2c3, #70a7bc, #679cb4, #5e91ab, #5586a3, #4d7b9a, #457091, #3e6588, #385b80, #325177, #2d486f, #293f68, #253861, #22315b, #202c56, #1e2852. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Muted navy and blue linear gradient
- Seed: `kSTiS3cBS5KUcyE`
- Page: https://grabient.com/kSTiS3cBS5KUcyE?steps=48&angle=45
- Drawn as: linear gradient, 48 steps, 45 degrees
- Kinds: light center, muted, cool, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.1 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 | `#1f3048` | `oklch(30.71% 0.0496 257.34)` | Manganese Black | white, 13.3 to 1 |
| 2 | `#22344c` | `oklch(32.13% 0.0498 255.92)` | Blue Lobelia | white, 12.6 to 1 |
| 3 | `#253951` | `oklch(33.94% 0.0499 254.10)` | Cool Air of Debonair | white, 11.7 to 1 |
| 4 | `#293f57` | `oklch(36.08% 0.0500 251.92)` | Blue Tone Ink | white, 10.8 to 1 |
| 5 | `#2e465e` | `oklch(38.53% 0.0502 249.44)` | Indigo Streamer | white, 9.7 to 1 |
| 6 | `#344e65` | `oklch(41.23% 0.0503 246.69)` | Rain Boots | white, 8.6 to 1 |
| 7 | `#3a566d` | `oklch(44.14% 0.0505 243.71)` | Winner’s Circle | white, 7.6 to 1 |
| 8 | `#415f75` | `oklch(47.24% 0.0507 240.55)` | Eclipse Blue | white, 6.6 to 1 |
| 9 | `#48697e` | `oklch(50.47% 0.0509 237.26)` | Eames for Blue | white, 5.8 to 1 |
| 10 | `#507387` | `oklch(53.81% 0.0511 233.86)` | Inky Blue | white, 5 to 1 |
| 11 | `#587e91` | `oklch(57.19% 0.0513 230.42)` | Technical Blue | black, 4.8 to 1 |
| 12 | `#61899a` | `oklch(60.60% 0.0515 226.96)` | Durban Sky | black, 5.5 to 1 |
| 13 | `#6993a3` | `oklch(63.98% 0.0517 223.54)` | Wave Jumper | black, 6.3 to 1 |
| 14 | `#729ead` | `oklch(67.30% 0.0520 220.19)` | Meetinghouse Blue | black, 7.2 to 1 |
| 15 | `#7ba9b5` | `oklch(70.51% 0.0523 216.95)` | Winter Twilight | black, 8.1 to 1 |
| 16 | `#83b3be` | `oklch(73.58% 0.0526 213.88)` | Thistleblossom Soft Blue | black, 9.1 to 1 |
| 17 | `#8cbcc6` | `oklch(76.47% 0.0529 211.01)` | Kingston Aqua | black, 10.1 to 1 |
| 18 | `#93c5cd` | `oklch(79.13% 0.0533 208.39)` | Adriatic Haze | black, 11.1 to 1 |
| 19 | `#9acdd4` | `oklch(81.53% 0.0537 206.05)` | Peppermint Twist | black, 12 to 1 |
| 20 | `#a0d4da` | `oklch(83.62% 0.0541 204.05)` | Midwinter Mist | black, 12.9 to 1 |
| 21 | `#a5dade` | `oklch(85.37% 0.0546 202.42)` | Crystal | black, 13.7 to 1 |
| 22 | `#a9dfe2` | `oklch(86.73% 0.0551 201.21)` | Blue Bauble | black, 14.3 to 1 |
| 23 | `#ace2e5` | `oklch(87.67% 0.0556 200.45)` | Opal | black, 14.7 to 1 |
| 24 | `#ade4e7` | `oklch(88.14% 0.0562 200.20)` | Timeless Seafoam | black, 14.9 to 1 |
| 25 | `#ace4e7` | `oklch(88.11% 0.0568 200.50)` | Timeless Seafoam | black, 14.9 to 1 |
| 26 | `#aae2e6` | `oklch(87.57% 0.0575 201.36)` | Opal | black, 14.7 to 1 |
| 27 | `#a6dfe4` | `oklch(86.56% 0.0583 202.74)` | Blue Bauble | black, 14.2 to 1 |
| 28 | `#a1dae0` | `oklch(85.12% 0.0592 204.60)` | Terrace Pool | black, 13.6 to 1 |
| 29 | `#9ad4dc` | `oklch(83.30% 0.0601 206.88)` | Dulcet | black, 12.8 to 1 |
| 30 | `#93cdd7` | `oklch(81.13% 0.0611 209.56)` | Blue Stream | black, 11.9 to 1 |
| 31 | `#8bc5d1` | `oklch(78.65% 0.0621 212.57)` | After the Rain | black, 10.9 to 1 |
| 32 | `#82bbca` | `oklch(75.91% 0.0632 215.87)` | Azure Lake | black, 9.9 to 1 |
| 33 | `#79b2c3` | `oklch(72.95% 0.0643 219.42)` | Glacier | black, 8.9 to 1 |
| 34 | `#70a7bc` | `oklch(69.80% 0.0654 223.18)` | Milky Blue | black, 7.9 to 1 |
| 35 | `#679cb4` | `oklch(66.51% 0.0665 227.08)` | Yacht Blue | black, 7 to 1 |
| 36 | `#5e91ab` | `oklch(63.11% 0.0677 231.10)` | Blue Persia | black, 6.1 to 1 |
| 37 | `#5586a3` | `oklch(59.66% 0.0688 235.18)` | Blue Team Spirit | black, 5.3 to 1 |
| 38 | `#4d7b9a` | `oklch(56.18% 0.0699 239.27)` | Stormy Ridge | black, 4.6 to 1 |
| 39 | `#457091` | `oklch(52.72% 0.0710 243.34)` | Sailor’s Bay | white, 5.2 to 1 |
| 40 | `#3e6588` | `oklch(49.32% 0.0721 247.33)` | French Mirage Blue | white, 6.1 to 1 |
| 41 | `#385b80` | `oklch(46.02% 0.0731 251.21)` | Matisse | white, 7 to 1 |
| 42 | `#325177` | `oklch(42.86% 0.0741 254.91)` | Aerostatics | white, 8.1 to 1 |
| 43 | `#2d486f` | `oklch(39.88% 0.0750 258.41)` | Enchanted Navy | white, 9.2 to 1 |
| 44 | `#293f68` | `oklch(37.13% 0.0759 261.64)` | Elmer’s Echo | white, 10.4 to 1 |
| 45 | `#253861` | `oklch(34.63% 0.0767 264.57)` | Midnight Sleigh | white, 11.5 to 1 |
| 46 | `#22315b` | `oklch(32.44% 0.0774 267.15)` | Ending Navy Blue | white, 12.6 to 1 |
| 47 | `#202c56` | `oklch(30.60% 0.0780 269.34)` | Pico Void | white, 13.5 to 1 |
| 48 | `#1e2852` | `oklch(29.13% 0.0785 271.08)` | Space Cadet | white, 14.2 to 1 |

## CSS

```css
background: linear-gradient(45deg, #1f3048 0.0%, #22344c 2.1%, #253951 4.3%, #293f57 6.4%, #2e465e 8.5%, #344e65 10.6%, #3a566d 12.8%, #415f75 14.9%, #48697e 17.0%, #507387 19.1%, #587e91 21.3%, #61899a 23.4%, #6993a3 25.5%, #729ead 27.7%, #7ba9b5 29.8%, #83b3be 31.9%, #8cbcc6 34.0%, #93c5cd 36.2%, #9acdd4 38.3%, #a0d4da 40.4%, #a5dade 42.6%, #a9dfe2 44.7%, #ace2e5 46.8%, #ade4e7 48.9%, #ace4e7 51.1%, #aae2e6 53.2%, #a6dfe4 55.3%, #a1dae0 57.4%, #9ad4dc 59.6%, #93cdd7 61.7%, #8bc5d1 63.8%, #82bbca 66.0%, #79b2c3 68.1%, #70a7bc 70.2%, #679cb4 72.3%, #5e91ab 74.5%, #5586a3 76.6%, #4d7b9a 78.7%, #457091 80.9%, #3e6588 83.0%, #385b80 85.1%, #325177 87.2%, #2d486f 89.4%, #293f68 91.5%, #253861 93.6%, #22315b 95.7%, #202c56 97.9%, #1e2852 100.0%);
background: linear-gradient(45deg in oklch, oklch(30.71% 0.0496 257.34) 0.0%, oklch(32.13% 0.0498 255.92) 2.1%, oklch(33.94% 0.0499 254.10) 4.3%, oklch(36.08% 0.0500 251.92) 6.4%, oklch(38.53% 0.0502 249.44) 8.5%, oklch(41.23% 0.0503 246.69) 10.6%, oklch(44.14% 0.0505 243.71) 12.8%, oklch(47.24% 0.0507 240.55) 14.9%, oklch(50.47% 0.0509 237.26) 17.0%, oklch(53.81% 0.0511 233.86) 19.1%, oklch(57.19% 0.0513 230.42) 21.3%, oklch(60.60% 0.0515 226.96) 23.4%, oklch(63.98% 0.0517 223.54) 25.5%, oklch(67.30% 0.0520 220.19) 27.7%, oklch(70.51% 0.0523 216.95) 29.8%, oklch(73.58% 0.0526 213.88) 31.9%, oklch(76.47% 0.0529 211.01) 34.0%, oklch(79.13% 0.0533 208.39) 36.2%, oklch(81.53% 0.0537 206.05) 38.3%, oklch(83.62% 0.0541 204.05) 40.4%, oklch(85.37% 0.0546 202.42) 42.6%, oklch(86.73% 0.0551 201.21) 44.7%, oklch(87.67% 0.0556 200.45) 46.8%, oklch(88.14% 0.0562 200.20) 48.9%, oklch(88.11% 0.0568 200.50) 51.1%, oklch(87.57% 0.0575 201.36) 53.2%, oklch(86.56% 0.0583 202.74) 55.3%, oklch(85.12% 0.0592 204.60) 57.4%, oklch(83.30% 0.0601 206.88) 59.6%, oklch(81.13% 0.0611 209.56) 61.7%, oklch(78.65% 0.0621 212.57) 63.8%, oklch(75.91% 0.0632 215.87) 66.0%, oklch(72.95% 0.0643 219.42) 68.1%, oklch(69.80% 0.0654 223.18) 70.2%, oklch(66.51% 0.0665 227.08) 72.3%, oklch(63.11% 0.0677 231.10) 74.5%, oklch(59.66% 0.0688 235.18) 76.6%, oklch(56.18% 0.0699 239.27) 78.7%, oklch(52.72% 0.0710 243.34) 80.9%, oklch(49.32% 0.0721 247.33) 83.0%, oklch(46.02% 0.0731 251.21) 85.1%, oklch(42.86% 0.0741 254.91) 87.2%, oklch(39.88% 0.0750 258.41) 89.4%, oklch(37.13% 0.0759 261.64) 91.5%, oklch(34.63% 0.0767 264.57) 93.6%, oklch(32.44% 0.0774 267.15) 95.7%, oklch(30.60% 0.0780 269.34) 97.9%, oklch(29.13% 0.0785 271.08) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.307 | 0.05 | 257.3 |
| 2 | 0.882 | 0.056 | 200.3 |
| 3 | 0.291 | 0.079 | 271.1 |

## In these collections

- [School uniform](https://grabient.com/school-uniform)

## Other forms

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