# Antique Brass and Blue Facets

These angular wedges move through vivid gold, deep blue, gold, and pale blue. The complete visible route keeps the collection’s named color relationship clear while providing distinct light and dark areas for type, marks, and framing. Use these angular wedges for posters, presentation covers, packaging, or interface backgrounds that need coordinated color roles and a strong focal transition.

- Also called: Brown, navy, tan and light blue angular swatches
- Seed: `kUjk9DnqJTeGnq7tF9RA`
- Page: https://grabient.com/kUjk9DnqJTeGnq7tF9RA?style=angularSwatches&steps=4&angle=210
- Drawn as: angular swatches, 4 steps, 210 degrees
- Kinds: dark center, vivid, multicolor
- Hues: two-hue
- 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 | `#887313` | `oklch(55.91% 0.1089 94.92)` | Vermin Brown | white, 4.6 to 1 |
| 2 | `#011c4b` | `oklch(24.02% 0.0937 259.78)` | Oxford Blue | white, 16.6 to 1 |
| 3 | `#d0b05d` | `oklch(76.77% 0.1089 88.58)` | Tanami Desert | black, 10 to 1 |
| 4 | `#b9d2fc` | `oklch(85.83% 0.0648 260.83)` | Ice Cold Stare | black, 13.6 to 1 |

## CSS

```css
background: conic-gradient(from 210deg, #887313 0.000% 25.000%, #011c4b 25.000% 50.000%, #d0b05d 50.000% 75.000%, #b9d2fc 75.000% 100.000%);
background: conic-gradient(from 210deg, oklch(55.91% 0.1089 94.92) 0.000% 25.000%, oklch(24.02% 0.0937 259.78) 25.000% 50.000%, oklch(76.77% 0.1089 88.58) 50.000% 75.000%, oklch(85.83% 0.0648 260.83) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.559 | 0.109 | 94.9 |
| 2 | 0.24 | 0.094 | 259.8 |
| 3 | 0.768 | 0.109 | 88.6 |
| 4 | 0.858 | 0.065 | 260.8 |

## In these collections

- [Complementary swatches](https://grabient.com/complementary-swatches)

## Other forms

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