# Near-black, gray and pale blush color palette

The Near-black, gray and pale blush color palette brings together dark gray, light gray, green, light magenta, and off-white. The colors span a very broad lightness range, combining restrained color with high contrast. Its balanced and composed character suits website sections and interface mockups. Its darkest tone is dark gray, and its lightest tone is off-white.

- Also called: Black, gray and white angular swatches
- Seed: `kWOAlucAS_86Mv_nDKx-wM_4`
- Page: https://grabient.com/kWOAlucAS_86Mv_nDKx-wM_4?style=angularSwatches&steps=5&angle=205
- Drawn as: angular swatches, 5 steps, 205 degrees
- Kinds: neutral
- Hues: wide
- Contrast of its darkest and lightest colors: 15.6 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 | `#161c18` | `oklch(22.05% 0.0124 154.69)` | Twilight Zone | white, 17.2 to 1 |
| 2 | `#d2dbd4` | `oklch(88.19% 0.0124 154.69)` | Light Zen | black, 14.7 to 1 |
| 3 | `#768c7d` | `oklch(61.81% 0.0344 154.69)` | Salty Sea | black, 5.8 to 1 |
| 4 | `#d4b9c4` | `oklch(81.10% 0.0344 349.83)` | Lavender Blessing | black, 11.4 to 1 |
| 5 | `#f9f2f5` | `oklch(96.85% 0.0083 349.83)` | Abalone | black, 19.1 to 1 |

## CSS

```css
background: conic-gradient(from 205deg, #161c18 0.000% 20.000%, #d2dbd4 20.000% 40.000%, #768c7d 40.000% 60.000%, #d4b9c4 60.000% 80.000%, #f9f2f5 80.000% 100.000%);
background: conic-gradient(from 205deg, oklch(22.05% 0.0124 154.69) 0.000% 20.000%, oklch(88.19% 0.0124 154.69) 20.000% 40.000%, oklch(61.81% 0.0344 154.69) 40.000% 60.000%, oklch(81.10% 0.0344 349.83) 60.000% 80.000%, oklch(96.85% 0.0083 349.83) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.22 | 0.012 | 154.7 |
| 2 | 0.882 | 0.012 | 154.7 |
| 3 | 0.618 | 0.034 | 154.7 |
| 4 | 0.811 | 0.034 | -10.2 |
| 5 | 0.969 | 0.008 | -10.2 |

## In these collections

- [Minimal color palette](https://grabient.com/minimal-color-palette)
- [Light mode color palette](https://grabient.com/light-mode-color-palette)
- [UI swatches](https://grabient.com/ui-swatches)
- [Marble swatches](https://grabient.com/marble-swatches)

## Other forms

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