# Near-black and tan beach palette

The Near-black and tan beach palette brings together dark gray, orange, and light orange. The colors span a broad lightness range, combining restrained color with clear contrast. Its balanced and composed character suits travel posters and environmental mood boards. Its darkest tone is dark gray, and its lightest tone is light orange.

- Also called: Monochrome black and beige angular swatches
- Seed: `kWLgkqqIlAr0OwLUFEDaBDAo`
- Page: https://grabient.com/kWLgkqqIlAr0OwLUFEDaBDAo?style=angularSwatches&steps=5&angle=200
- Drawn as: angular swatches, 5 steps, 200 degrees
- Kinds: dark to light, muted, warm, monochrome
- Hues: analogous
- Contrast of its darkest and lightest colors: 10.7 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 | `#16110c` | `oklch(18.11% 0.0124 59.77)` | Black Raspberry | white, 18.7 to 1 |
| 2 | `#3b3025` | `oklch(31.89% 0.0248 66.11)` | Cola Bubble | white, 12.7 to 1 |
| 3 | `#6c5a45` | `oklch(48.03% 0.0400 72.45)` | Cummings Oak | white, 6.5 to 1 |
| 4 | `#a58f6c` | `oklch(66.14% 0.0551 79.84)` | Rodeo Roundup | black, 6.7 to 1 |
| 5 | `#d1c2a3` | `oklch(81.89% 0.0455 86.18)` | Double Spanish White | black, 11.9 to 1 |

## CSS

```css
background: conic-gradient(from 200deg, #16110c 0.000% 20.000%, #3b3025 20.000% 40.000%, #6c5a45 40.000% 60.000%, #a58f6c 60.000% 80.000%, #d1c2a3 80.000% 100.000%);
background: conic-gradient(from 200deg, oklch(18.11% 0.0124 59.77) 0.000% 20.000%, oklch(31.89% 0.0248 66.11) 20.000% 40.000%, oklch(48.03% 0.0400 72.45) 40.000% 60.000%, oklch(66.14% 0.0551 79.84) 60.000% 80.000%, oklch(81.89% 0.0455 86.18) 80.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.181 | 0.012 | 59.8 |
| 2 | 0.319 | 0.025 | 66.1 |
| 3 | 0.48 | 0.04 | 72.4 |
| 4 | 0.661 | 0.055 | 79.8 |
| 5 | 0.819 | 0.045 | 86.2 |

## In these collections

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

## Other forms

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