# Navy periwinkle blush vertical bands

Duotone navy and light pink linear swatches with 13 colors: #143c5e, #1d466b, #2b547d, #3b648f, #4c729f, #5f81ae, #7490bc, #8c9fc8, #a5aed2, #bebcdb, #d9c9e3, #f3d4e5, #ffe0e5. Edit it and copy or download CSS, SVG, PNG or shader code.

- Also called: Duotone navy and light pink linear swatches
- Seed: `kWWDawPp7AdKawNmj8Ndo9JI`
- Page: https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI?style=linearSwatches&steps=13
- Drawn as: linear swatches, 13 steps, 90 degrees
- Kinds: dark to light, muted, cool
- Hues: analogous
- Contrast of its darkest and lightest colors: 9.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 | `#143c5e` | `oklch(34.65% 0.0744 247.50)` | Poseidon | white, 11.4 to 1 |
| 2 | `#1d466b` | `oklch(38.38% 0.0777 248.48)` | Terror From the Deep | white, 9.8 to 1 |
| 3 | `#2b547d` | `oklch(43.73% 0.0820 249.93)` | Blueberry Twist | white, 7.8 to 1 |
| 4 | `#3b648f` | `oklch(49.21% 0.0841 251.73)` | Blue Ribbon Beauty | white, 6.1 to 1 |
| 5 | `#4c729f` | `oklch(54.37% 0.0826 253.18)` | Cobalt Flame | white, 4.9 to 1 |
| 6 | `#5f81ae` | `oklch(59.67% 0.0789 254.98)` | Girls in Blue | black, 5.2 to 1 |
| 7 | `#7490bc` | `oklch(64.96% 0.0730 259.12)` | Purple Hyacinth | black, 6.4 to 1 |
| 8 | `#8c9fc8` | `oklch(70.33% 0.0633 265.23)` | Blue Heron | black, 7.9 to 1 |
| 9 | `#a5aed2` | `oklch(75.69% 0.0514 273.68)` | Mild Blue Yonder | black, 9.6 to 1 |
| 10 | `#bebcdb` | `oklch(80.71% 0.0427 287.66)` | Wisteria Fragrance | black, 11.4 to 1 |
| 11 | `#d9c9e3` | `oklch(85.61% 0.0401 312.94)` | Purity | black, 13.3 to 1 |
| 12 | `#f3d4e5` | `oklch(90.16% 0.0406 343.74)` | Hopeful | black, 15.4 to 1 |
| 13 | `#ffe0e5` | `oklch(93.31% 0.0352 5.85)` | Pink Pleasure | black, 17 to 1 |

## CSS

```css
background: linear-gradient(90deg, #143c5e 0.000% 7.692%, #1d466b 7.692% 15.385%, #2b547d 15.385% 23.077%, #3b648f 23.077% 30.769%, #4c729f 30.769% 38.462%, #5f81ae 38.462% 46.154%, #7490bc 46.154% 53.846%, #8c9fc8 53.846% 61.538%, #a5aed2 61.538% 69.231%, #bebcdb 69.231% 76.923%, #d9c9e3 76.923% 84.615%, #f3d4e5 84.615% 92.308%, #ffe0e5 92.308% 100.000%);
background: linear-gradient(90deg, oklch(34.65% 0.0744 247.50) 0.000% 7.692%, oklch(38.38% 0.0777 248.48) 7.692% 15.385%, oklch(43.73% 0.0820 249.93) 15.385% 23.077%, oklch(49.21% 0.0841 251.73) 23.077% 30.769%, oklch(54.37% 0.0826 253.18) 30.769% 38.462%, oklch(59.67% 0.0789 254.98) 38.462% 46.154%, oklch(64.96% 0.0730 259.12) 46.154% 53.846%, oklch(70.33% 0.0633 265.23) 53.846% 61.538%, oklch(75.69% 0.0514 273.68) 61.538% 69.231%, oklch(80.71% 0.0427 287.66) 69.231% 76.923%, oklch(85.61% 0.0401 312.94) 76.923% 84.615%, oklch(90.16% 0.0406 343.74) 84.615% 92.308%, oklch(93.31% 0.0352 5.85) 92.308% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.346 | 0.074 | 247.5 |
| 2 | 0.492 | 0.084 | 251.7 |
| 3 | 0.65 | 0.073 | 259.1 |
| 4 | 0.807 | 0.043 | 287.7 |
| 5 | 0.933 | 0.041 | 365.9 |

## In these collections

- [Dusk swatches](https://grabient.com/dusk-swatches)

## Other forms

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