# Duotone navy and light pink linear swatches

Duotone navy and light pink linear swatches with 9 colors: #143c5e, #244d74, #3b648f, #557aa6, #7490bc, #99a7cd, #bebcdb, #e7cfe5, #ffe0e5. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kWWDawPp7AdKawNmj8Ndo9JI`
- Page: https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI?style=linearSwatches&steps=9
- Drawn as: linear swatches, 9 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 | `#244d74` | `oklch(40.94% 0.0799 249.15)` | Mykonos Reflection | white, 8.8 to 1 |
| 3 | `#3b648f` | `oklch(49.21% 0.0841 251.73)` | Blue Ribbon Beauty | white, 6.1 to 1 |
| 4 | `#557aa6` | `oklch(57.01% 0.0810 253.91)` | Vinca | black, 4.7 to 1 |
| 5 | `#7490bc` | `oklch(64.96% 0.0730 259.12)` | Purple Hyacinth | black, 6.4 to 1 |
| 6 | `#99a7cd` | `oklch(73.03% 0.0573 268.97)` | Bright Bluebell | black, 8.7 to 1 |
| 7 | `#bebcdb` | `oklch(80.71% 0.0427 287.66)` | Wisteria Fragrance | black, 11.4 to 1 |
| 8 | `#e7cfe5` | `oklch(87.99% 0.0401 328.54)` | Lilacs in Spring | black, 14.4 to 1 |
| 9 | `#ffe0e5` | `oklch(93.31% 0.0352 5.85)` | Pink Pleasure | black, 17 to 1 |

## CSS

```css
background: linear-gradient(90deg, #143c5e 0.000% 11.111%, #244d74 11.111% 22.222%, #3b648f 22.222% 33.333%, #557aa6 33.333% 44.444%, #7490bc 44.444% 55.556%, #99a7cd 55.556% 66.667%, #bebcdb 66.667% 77.778%, #e7cfe5 77.778% 88.889%, #ffe0e5 88.889% 100.000%);
background: linear-gradient(90deg, oklch(34.65% 0.0744 247.50) 0.000% 11.111%, oklch(40.94% 0.0799 249.15) 11.111% 22.222%, oklch(49.21% 0.0841 251.73) 22.222% 33.333%, oklch(57.01% 0.0810 253.91) 33.333% 44.444%, oklch(64.96% 0.0730 259.12) 44.444% 55.556%, oklch(73.03% 0.0573 268.97) 55.556% 66.667%, oklch(80.71% 0.0427 287.66) 66.667% 77.778%, oklch(87.99% 0.0401 328.54) 77.778% 88.889%, oklch(93.31% 0.0352 5.85) 88.889% 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=9)
- [PNG](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.png?style=linearSwatches&steps=9)
- [SVG](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.svg?style=linearSwatches&steps=9)
- [CSS](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.css?style=linearSwatches&steps=9)
- [ASE](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.ase?style=linearSwatches&steps=9)
- [GPL](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.gpl?style=linearSwatches&steps=9)
- [GRD](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.grd?style=linearSwatches&steps=9)
- [Design tokens](https://grabient.com/kWWDawPp7AdKawNmj8Ndo9JI.tokens.json?style=linearSwatches&steps=9)
- [Social card](https://grabient.com/api/og?seed=kWWDawPp7AdKawNmj8Ndo9JI&style=linearSwatches&steps=9)
- [Palettes like this one](https://grabient.com/palettes?q=kWWDawPp7AdKawNmj8Ndo9JI)
- [Guide for agents](https://grabient.com/llms.txt)