# Champagne, off-white and pale blue white palette

The Champagne, off-white and pale blue white palette brings together off-white. The colors span a narrow lightness range, combining near-neutral color with gentle contrast. Its quiet and understated character suits brand mood boards and editorial graphics. Its lightest and darkest tones both fall within the off-white color family.

- Also called: White angular gradient
- Seed: `kW_QRC9IW-nQBzx3hEG_oE_o`
- Page: https://grabient.com/kW_QRC9IW-nQBzx3hEG_oE_o?style=angularGradient&steps=32&angle=225
- Drawn as: angular gradient, 32 steps, 225 degrees
- Kinds: even lightness, neutral, light
- Hues: achromatic
- Contrast of its darkest and lightest colors: 1.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 | `#fffefa` | `oklch(99.61% 0.0055 93.52)` | Baby Powder | black, 20.7 to 1 |
| 2 | `#fdfbf7` | `oklch(98.92% 0.0064 91.57)` | Cool December | black, 20.3 to 1 |
| 3 | `#faf8f2` | `oklch(97.95% 0.0078 87.90)` | Pure White | black, 19.7 to 1 |
| 4 | `#f7f4ed` | `oklch(96.79% 0.0095 83.46)` | Crystal Cut | black, 19.1 to 1 |
| 5 | `#f4f0e8` | `oklch(95.54% 0.0112 79.23)` | Antique Paper | black, 18.4 to 1 |
| 6 | `#f1ebe3` | `oklch(94.29% 0.0129 76.19)` | Woolly Lamb | black, 17.7 to 1 |
| 7 | `#eee7de` | `oklch(93.16% 0.0142 75.31)` | Severe Seal | black, 17.1 to 1 |
| 8 | `#ebe4db` | `oklch(92.23% 0.0150 77.56)` | Pampas | black, 16.6 to 1 |
| 9 | `#e8e3d8` | `oklch(91.61% 0.0151 83.97)` | Moon Shell | black, 16.3 to 1 |
| 10 | `#e5e2d8` | `oklch(91.21% 0.0144 95.84)` | Dove White | black, 16.1 to 1 |
| 11 | `#e1e2d9` | `oklch(90.98% 0.0129 112.20)` | Hygge Green | black, 16 to 1 |
| 12 | `#dee2db` | `oklch(90.88% 0.0111 131.42)` | Slow Down | black, 16 to 1 |
| 13 | `#dde3de` | `oklch(90.88% 0.0091 151.89)` | Whitecap Foam | black, 16 to 1 |
| 14 | `#dde3e0` | `oklch(90.97% 0.0071 171.96)` | Whitecap Foam | black, 16.1 to 1 |
| 15 | `#dee3e2` | `oklch(91.10% 0.0055 190.02)` | Zircon | black, 16.1 to 1 |
| 16 | `#dfe3e3` | `oklch(91.26% 0.0044 204.43)` | Zircon | black, 16.2 to 1 |
| 17 | `#e0e3e4` | `oklch(91.42% 0.0041 213.94)` | Cold Wind | black, 16.3 to 1 |
| 18 | `#e0e4e5` | `oklch(91.63% 0.0046 219.99)` | Cold Wind | black, 16.4 to 1 |
| 19 | `#e0e5e7` | `oklch(91.90% 0.0056 223.50)` | Shaving Cream | black, 16.5 to 1 |
| 20 | `#e1e6e9` | `oklch(92.22% 0.0069 225.06)` | Winter Haven | black, 16.7 to 1 |
| 21 | `#e1e8eb` | `oklch(92.58% 0.0083 225.32)` | Sweet Illusion | black, 16.9 to 1 |
| 22 | `#e1e9ed` | `oklch(93.00% 0.0096 224.88)` | Bellflower Blue | black, 17.1 to 1 |
| 23 | `#e2ebef` | `oklch(93.46% 0.0106 224.36)` | Himalaya Peaks | black, 17.3 to 1 |
| 24 | `#e4edf1` | `oklch(93.96% 0.0110 224.39)` | Morning Mist | black, 17.6 to 1 |
| 25 | `#e6eff2` | `oklch(94.54% 0.0108 225.01)` | Sheikh Zayed White | black, 17.9 to 1 |
| 26 | `#e9f1f4` | `oklch(95.26% 0.0100 225.18)` | Powder White | black, 18.3 to 1 |
| 27 | `#ecf3f7` | `oklch(96.07% 0.0089 224.97)` | Insignia White | black, 18.7 to 1 |
| 28 | `#f0f6f9` | `oklch(96.92% 0.0075 224.49)` | Silent Snowfall | black, 19.2 to 1 |
| 29 | `#f3f9fb` | `oklch(97.75% 0.0061 223.88)` | Distant Horizon | black, 19.7 to 1 |
| 30 | `#f7fbfc` | `oklch(98.51% 0.0047 223.25)` | Deutzia White | black, 20.1 to 1 |
| 31 | `#fafdfe` | `oklch(99.14% 0.0035 222.73)` | Emptiness | black, 20.5 to 1 |
| 32 | `#fcfeff` | `oklch(99.61% 0.0026 222.15)` | Polar Bear in a Blizzard | black, 20.7 to 1 |

## CSS

```css
background: conic-gradient(from 225deg, #fffefa 0.0%, #fdfbf7 3.2%, #faf8f2 6.5%, #f7f4ed 9.7%, #f4f0e8 12.9%, #f1ebe3 16.1%, #eee7de 19.4%, #ebe4db 22.6%, #e8e3d8 25.8%, #e5e2d8 29.0%, #e1e2d9 32.3%, #dee2db 35.5%, #dde3de 38.7%, #dde3e0 41.9%, #dee3e2 45.2%, #dfe3e3 48.4%, #e0e3e4 51.6%, #e0e4e5 54.8%, #e0e5e7 58.1%, #e1e6e9 61.3%, #e1e8eb 64.5%, #e1e9ed 67.7%, #e2ebef 71.0%, #e4edf1 74.2%, #e6eff2 77.4%, #e9f1f4 80.6%, #ecf3f7 83.9%, #f0f6f9 87.1%, #f3f9fb 90.3%, #f7fbfc 93.5%, #fafdfe 96.8%, #fcfeff 100.0%);
background: conic-gradient(from 225deg in oklch, oklch(99.61% 0.0055 93.52) 0.0%, oklch(98.92% 0.0064 91.57) 3.2%, oklch(97.95% 0.0078 87.90) 6.5%, oklch(96.79% 0.0095 83.46) 9.7%, oklch(95.54% 0.0112 79.23) 12.9%, oklch(94.29% 0.0129 76.19) 16.1%, oklch(93.16% 0.0142 75.31) 19.4%, oklch(92.23% 0.0150 77.56) 22.6%, oklch(91.61% 0.0151 83.97) 25.8%, oklch(91.21% 0.0144 95.84) 29.0%, oklch(90.98% 0.0129 112.20) 32.3%, oklch(90.88% 0.0111 131.42) 35.5%, oklch(90.88% 0.0091 151.89) 38.7%, oklch(90.97% 0.0071 171.96) 41.9%, oklch(91.10% 0.0055 190.02) 45.2%, oklch(91.26% 0.0044 204.43) 48.4%, oklch(91.42% 0.0041 213.94) 51.6%, oklch(91.63% 0.0046 219.99) 54.8%, oklch(91.90% 0.0056 223.50) 58.1%, oklch(92.22% 0.0069 225.06) 61.3%, oklch(92.58% 0.0083 225.32) 64.5%, oklch(93.00% 0.0096 224.88) 67.7%, oklch(93.46% 0.0106 224.36) 71.0%, oklch(93.96% 0.0110 224.39) 74.2%, oklch(94.54% 0.0108 225.01) 77.4%, oklch(95.26% 0.0100 225.18) 80.6%, oklch(96.07% 0.0089 224.97) 83.9%, oklch(96.92% 0.0075 224.49) 87.1%, oklch(97.75% 0.0061 223.88) 90.3%, oklch(98.51% 0.0047 223.25) 93.5%, oklch(99.14% 0.0035 222.73) 96.8%, oklch(99.61% 0.0026 222.15) 100.0%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.996 | 0.006 | 93.5 |
| 2 | 0.917 | 0.015 | 81.9 |
| 3 | 0.913 | 0.004 | 209.8 |
| 4 | 0.941 | 0.011 | 224.6 |
| 5 | 0.996 | 0.003 | 222.4 |

## In these collections

- [White gradients](https://grabient.com/white-gradients)

## Other forms

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