# Pastel duotone beige to blue linear gradient

Pastel duotone beige to blue linear gradient with 32 colors: #ffebc0, #ffeaba, #fce9bc, #f8e9c1, #f3e8c6, #eee7cb, #eae6cf, #e5e5d2, #e1e4d4, #dde3d5, #d7e2d6, #d2e2d8, #cce1db, #c7dfdf, #c2dee3, #bfdce7, #bddaea, #b9d9ed, #b4d7f0, #afd7f4, #a9d6f7, #a2d5fa, #9cd5fd, #96d4ff, #93d3ff, #8fd2ff, #8bd1ff, #85d0ff, #80cfff, #7bceff, #77cdfe, #74cdfe. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kW8DU9dAhDG8NTZrIEFZyg_Y`
- Page: https://grabient.com/kW8DU9dAhDG8NTZrIEFZyg_Y?steps=32&angle=180
- Drawn as: linear gradient, 32 steps, 180 degrees
- Kinds: pastel, light
- Hues: complementary
- Contrast of its darkest and lightest colors: 1.5 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 | `#ffebc0` | `oklch(94.49% 0.0601 85.79)` | Urnebes Beige | black, 17.8 to 1 |
| 2 | `#ffeaba` | `oklch(94.24% 0.0661 87.26)` | Sun-Kissed Yellow | black, 17.7 to 1 |
| 3 | `#fce9bc` | `oklch(93.92% 0.0619 88.53)` | Frozen Custard | black, 17.5 to 1 |
| 4 | `#f8e9c1` | `oklch(93.53% 0.0540 90.01)` | Barely Butter | black, 17.3 to 1 |
| 5 | `#f3e8c6` | `oklch(93.10% 0.0456 92.10)` | Ethereal Green | black, 17.1 to 1 |
| 6 | `#eee7cb` | `oklch(92.64% 0.0374 95.20)` | Banana Milkshake | black, 16.9 to 1 |
| 7 | `#eae6cf` | `oklch(92.17% 0.0302 99.71)` | Elderberry White | black, 16.7 to 1 |
| 8 | `#e5e5d2` | `oklch(91.69% 0.0246 106.03)` | Sage Splash | black, 16.4 to 1 |
| 9 | `#e1e4d4` | `oklch(91.22% 0.0215 114.63)` | Greening | black, 16.2 to 1 |
| 10 | `#dde3d5` | `oklch(90.74% 0.0202 126.87)` | Water Lily | black, 16 to 1 |
| 11 | `#d7e2d6` | `oklch(90.23% 0.0202 142.25)` | Green Mirror | black, 15.7 to 1 |
| 12 | `#d2e2d8` | `oklch(89.70% 0.0213 159.52)` | Delicate Snow Goose | black, 15.5 to 1 |
| 13 | `#cce1db` | `oklch(89.17% 0.0234 177.43)` | Rio Sky | black, 15.3 to 1 |
| 14 | `#c7dfdf` | `oklch(88.64% 0.0262 194.77)` | Open Air | black, 15 to 1 |
| 15 | `#c2dee3` | `oklch(88.13% 0.0298 210.27)` | Ice Shard Soft Blue | black, 14.8 to 1 |
| 16 | `#bfdce7` | `oklch(87.63% 0.0337 222.71)` | Pacific Breeze | black, 14.5 to 1 |
| 17 | `#bddaea` | `oklch(87.18% 0.0382 231.09)` | Diamond Soft Blue | black, 14.3 to 1 |
| 18 | `#b9d9ed` | `oklch(86.74% 0.0440 236.39)` | First Rain | black, 14.1 to 1 |
| 19 | `#b4d7f0` | `oklch(86.33% 0.0509 239.36)` | Blue Rice | black, 13.9 to 1 |
| 20 | `#afd7f4` | `oklch(85.93% 0.0585 240.55)` | Blue Rice | black, 13.8 to 1 |
| 21 | `#a9d6f7` | `oklch(85.53% 0.0664 240.54)` | Malmö FF | black, 13.6 to 1 |
| 22 | `#a2d5fa` | `oklch(85.14% 0.0740 239.89)` | Malmö FF | black, 13.4 to 1 |
| 23 | `#9cd5fd` | `oklch(84.75% 0.0810 239.16)` | Malmö FF | black, 13.3 to 1 |
| 24 | `#96d4ff` | `oklch(84.35% 0.0869 238.93)` | Long Island Sound | black, 13.1 to 1 |
| 25 | `#93d3ff` | `oklch(83.93% 0.0899 239.20)` | Long Island Sound | black, 12.9 to 1 |
| 26 | `#8fd2ff` | `oklch(83.48% 0.0928 239.04)` | Long Island Sound | black, 12.8 to 1 |
| 27 | `#8bd1ff` | `oklch(83.01% 0.0961 238.50)` | Long Island Sound | black, 12.6 to 1 |
| 28 | `#85d0ff` | `oklch(82.54% 0.0997 237.72)` | Drift on the Sea | black, 12.4 to 1 |
| 29 | `#80cfff` | `oklch(82.09% 0.1033 236.83)` | Drift on the Sea | black, 12.2 to 1 |
| 30 | `#7bceff` | `oklch(81.69% 0.1067 235.96)` | Bubbly Barracuda | black, 12.1 to 1 |
| 31 | `#77cdfe` | `oklch(81.35% 0.1087 235.24)` | Bubbly Barracuda | black, 11.9 to 1 |
| 32 | `#74cdfe` | `oklch(81.10% 0.1102 234.78)` | Bubbly Barracuda | black, 11.8 to 1 |

## CSS

```css
background: linear-gradient(180deg, #ffebc0 0.0%, #ffeaba 3.2%, #fce9bc 6.5%, #f8e9c1 9.7%, #f3e8c6 12.9%, #eee7cb 16.1%, #eae6cf 19.4%, #e5e5d2 22.6%, #e1e4d4 25.8%, #dde3d5 29.0%, #d7e2d6 32.3%, #d2e2d8 35.5%, #cce1db 38.7%, #c7dfdf 41.9%, #c2dee3 45.2%, #bfdce7 48.4%, #bddaea 51.6%, #b9d9ed 54.8%, #b4d7f0 58.1%, #afd7f4 61.3%, #a9d6f7 64.5%, #a2d5fa 67.7%, #9cd5fd 71.0%, #96d4ff 74.2%, #93d3ff 77.4%, #8fd2ff 80.6%, #8bd1ff 83.9%, #85d0ff 87.1%, #80cfff 90.3%, #7bceff 93.5%, #77cdfe 96.8%, #74cdfe 100.0%);
background: linear-gradient(180deg in oklch, oklch(94.49% 0.0601 85.79) 0.0%, oklch(94.24% 0.0661 87.26) 3.2%, oklch(93.92% 0.0619 88.53) 6.5%, oklch(93.53% 0.0540 90.01) 9.7%, oklch(93.10% 0.0456 92.10) 12.9%, oklch(92.64% 0.0374 95.20) 16.1%, oklch(92.17% 0.0302 99.71) 19.4%, oklch(91.69% 0.0246 106.03) 22.6%, oklch(91.22% 0.0215 114.63) 25.8%, oklch(90.74% 0.0202 126.87) 29.0%, oklch(90.23% 0.0202 142.25) 32.3%, oklch(89.70% 0.0213 159.52) 35.5%, oklch(89.17% 0.0234 177.43) 38.7%, oklch(88.64% 0.0262 194.77) 41.9%, oklch(88.13% 0.0298 210.27) 45.2%, oklch(87.63% 0.0337 222.71) 48.4%, oklch(87.18% 0.0382 231.09) 51.6%, oklch(86.74% 0.0440 236.39) 54.8%, oklch(86.33% 0.0509 239.36) 58.1%, oklch(85.93% 0.0585 240.55) 61.3%, oklch(85.53% 0.0664 240.54) 64.5%, oklch(85.14% 0.0740 239.89) 67.7%, oklch(84.75% 0.0810 239.16) 71.0%, oklch(84.35% 0.0869 238.93) 74.2%, oklch(83.93% 0.0899 239.20) 77.4%, oklch(83.48% 0.0928 239.04) 80.6%, oklch(83.01% 0.0961 238.50) 83.9%, oklch(82.54% 0.0997 237.72) 87.1%, oklch(82.09% 0.1033 236.83) 90.3%, oklch(81.69% 0.1067 235.96) 93.5%, oklch(81.35% 0.1087 235.24) 96.8%, oklch(81.10% 0.1102 234.78) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.945 | 0.073 | 85.8 |
| 2 | 0.913 | 0.022 | 112.2 |
| 3 | 0.874 | 0.036 | 227.4 |
| 4 | 0.843 | 0.088 | 239 |
| 5 | 0.811 | 0.11 | 234.8 |

## In these collections

- [Beach gradients](https://grabient.com/beach-gradients)

## Other forms

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