# Near-Black Orange Deep Blue Wedges

These 4 angular wedges move through near-black orange, bright orange, magenta, and deep blue. The separated colors give backgrounds, type, borders, and accents distinct assignments. Use it for digital fashion graphics, music artwork, event posters, or bold interface backgrounds with a glossy electronic mood.

- Also called: Black, orange, purple and blue angular swatches
- Seed: `kUKR4mWEs-tHwtg-6Dlg`
- Page: https://grabient.com/kUKR4mWEs-tHwtg-6Dlg?style=angularSwatches&steps=4&angle=130
- Drawn as: angular swatches, 4 steps, 130 degrees
- Kinds: light center, vivid, neon, multicolor
- Hues: wide
- Contrast of its darkest and lightest colors: 6.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 | `#1b0800` | `oklch(16.15% 0.0411 52.83)` | Soy Sauce | white, 19.4 to 1 |
| 2 | `#ff6400` | `oklch(69.29% 0.2058 42.85)` | Chos Garden Marigold | black, 7 to 1 |
| 3 | `#d700fe` | `oklch(64.18% 0.3090 319.38)` | Psychedelic Purple | black, 5.3 to 1 |
| 4 | `#0838ff` | `oklch(49.21% 0.2862 264.44)` | C64 Blue | white, 6.9 to 1 |

## CSS

```css
background: conic-gradient(from 130deg, #1b0800 0.000% 25.000%, #ff6400 25.000% 50.000%, #d700fe 50.000% 75.000%, #0838ff 75.000% 100.000%);
background: conic-gradient(from 130deg, oklch(16.15% 0.0411 52.83) 0.000% 25.000%, oklch(69.29% 0.2058 42.85) 25.000% 50.000%, oklch(64.18% 0.3090 319.38) 50.000% 75.000%, oklch(49.21% 0.2862 264.44) 75.000% 100.000%);
```

## Keyframes

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

| Keyframe | Lightness | Chroma | Hue |
| --- | --- | --- | --- |
| 1 | 0.161 | 0.041 | 53.4 |
| 2 | 0.693 | 0.207 | 42.9 |
| 3 | 0.642 | 0.31 | -40.6 |
| 4 | 0.492 | 0.287 | -95.6 |

## In these collections

- [Glitchy glam](https://grabient.com/glitchy-glam)

## Other forms

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