# Near-black, silver and terracotta color palette

The Near-black, silver and terracotta color palette brings together dark gray, blue, off-white, purple, and orange. The colors span a very broad lightness range, combining moderate 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, purple and orange linear swatches
- Seed: `kYKwnSHQY_7CJP_zhr_zra_9UzTi`
- Page: https://grabient.com/kYKwnSHQY_7CJP_zhr_zra_9UzTi?style=linearSwatches&steps=6
- Drawn as: linear swatches, 6 steps, 90 degrees
- Kinds: light center, neutral, cool
- Hues: wide
- Contrast of its darkest and lightest colors: 14.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 | `#100e14` | `oklch(16.93% 0.0124 295.31)` | Ruined Smores | white, 19.1 to 1 |
| 2 | `#1d1b24` | `oklch(22.83% 0.0165 295.31)` | Night Demons | white, 17 to 1 |
| 3 | `#44404f` | `oklch(38.19% 0.0248 295.31)` | Loom of Fate | white, 10 to 1 |
| 4 | `#e2dfec` | `oklch(90.94% 0.0179 295.31)` | Velvet Scarf | black, 15.9 to 1 |
| 5 | `#8e70d5` | `oklch(61.81% 0.1502 295.31)` | Matt Purple | black, 5.4 to 1 |
| 6 | `#d57b32` | `oklch(66.93% 0.1406 55.78)` | Fired Up | black, 6.7 to 1 |

## CSS

```css
background: linear-gradient(90deg, #100e14 0.000% 16.667%, #1d1b24 16.667% 33.333%, #44404f 33.333% 50.000%, #e2dfec 50.000% 66.667%, #8e70d5 66.667% 83.333%, #d57b32 83.333% 100.000%);
background: linear-gradient(90deg, oklch(16.93% 0.0124 295.31) 0.000% 16.667%, oklch(22.83% 0.0165 295.31) 16.667% 33.333%, oklch(38.19% 0.0248 295.31) 33.333% 50.000%, oklch(90.94% 0.0179 295.31) 50.000% 66.667%, oklch(61.81% 0.1502 295.31) 66.667% 83.333%, oklch(66.93% 0.1406 55.78) 83.333% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.169 | 0.012 | 295.3 |
| 2 | 0.228 | 0.017 | 295.3 |
| 3 | 0.382 | 0.025 | 295.3 |
| 4 | 0.909 | 0.018 | 295.3 |
| 5 | 0.618 | 0.15 | 295.3 |
| 6 | 0.669 | 0.141 | 415.8 |

## In these collections

- [Modern swatches](https://grabient.com/modern-swatches)
- [Presentation swatches](https://grabient.com/presentation-swatches)
- [UI swatches](https://grabient.com/ui-swatches)

## Other forms

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