# Pastel blue, gray, peach and beige radial swatches

Pastel blue, gray, peach and beige radial swatches with 6 colors: #e4faf8, #beece7, #89dad4, #c3d8cc, #efc7ae, #fee1c4. Edit it and copy or download CSS, SVG, PNG or shader code.

- Seed: `kY9hGHc5G_2odQBtijybRSzXWSQU`
- Page: https://grabient.com/kY9hGHc5G_2odQBtijybRSzXWSQU?style=radialSwatches&steps=6
- Drawn as: radial swatches, 6 steps, 90 degrees
- Kinds: pastel, light
- Hues: split-complementary
- Contrast of its darkest and lightest colors: 1.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 | `#e4faf8` | `oklch(96.85% 0.0234 189.84)` | Calm Waters | black, 19.3 to 1 |
| 2 | `#beece7` | `oklch(90.94% 0.0482 188.79)` | Gentle Cold | black, 16.3 to 1 |
| 3 | `#89dad4` | `oklch(83.46% 0.0799 189.84)` | Rainwater | black, 13 to 1 |
| 4 | `#c3d8cc` | `oklch(86.22% 0.0276 161.31)` | Fuchsite | black, 13.9 to 1 |
| 5 | `#efc7ae` | `oklch(85.83% 0.0565 54.58)` | Sweet Pastel | black, 13.4 to 1 |
| 6 | `#fee1c4` | `oklch(92.52% 0.0496 66.20)` | Creamy Beige | black, 16.7 to 1 |

## CSS

```css
background: radial-gradient(circle at 50% 50%, #e4faf8 0.000% 16.667%, #beece7 16.667% 33.333%, #89dad4 33.333% 50.000%, #c3d8cc 50.000% 66.667%, #efc7ae 66.667% 83.333%, #fee1c4 83.333% 100.000%);
background: radial-gradient(circle at 50% 50%, oklch(96.85% 0.0234 189.84) 0.000% 16.667%, oklch(90.94% 0.0482 188.79) 16.667% 33.333%, oklch(83.46% 0.0799 189.84) 33.333% 50.000%, oklch(86.22% 0.0276 161.31) 50.000% 66.667%, oklch(85.83% 0.0565 54.58) 66.667% 83.333%, oklch(92.52% 0.0496 66.20) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.969 | 0.023 | 189.8 |
| 2 | 0.909 | 0.048 | 188.8 |
| 3 | 0.835 | 0.08 | 189.8 |
| 4 | 0.862 | 0.028 | 161.3 |
| 5 | 0.858 | 0.056 | 54.6 |
| 6 | 0.925 | 0.05 | 66.2 |

## In these collections

- [Teal and orange](https://grabient.com/teal-and-orange)
- [Tropical swatches](https://grabient.com/tropical-swatches)

## Other forms

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