# Rolocode — Colour

Dark-first, futuristic, high-contrast. A near-black canvas lit by a dual-neon
brand (violet → cyan), with two acid accents used sparingly.

![Palette](palette.png)

## Brand

| Token           | Hex        | RGB              | Use                                  |
|-----------------|------------|------------------|--------------------------------------|
| Violet          | `#7C3AED`  | 124, 58, 237     | Primary brand, left arm of the mark  |
| Violet Bright   | `#A855F7`  | 168, 85, 247     | Highlights, inner accent, gradients  |
| Cyan            | `#22D3EE`  | 34, 211, 238     | Secondary brand, links, swoosh       |
| Cyan Bright     | `#67E8F9`  | 103, 232, 249    | Lit edge, hover, glow                |

**Signature gradient:** `linear-gradient(110deg, #7C3AED 0%, #A855F7 40%, #22D3EE 100%)`

## Accent (use sparingly)

| Token    | Hex        | Use                                   |
|----------|------------|---------------------------------------|
| Lime     | `#B6FF3C`  | Rare "live"/success spark, status dot |
| Magenta  | `#FF2DAA`  | Rare hot accent in 3-stop gradients   |

## Surfaces (cool-tinted, never pure black)

| Token     | Hex        | Use                              |
|-----------|------------|----------------------------------|
| Void      | `#06060A`  | Deepest backdrop                 |
| Base      | `#0A0A0F`  | Page background                  |
| Subtle    | `#0F0F17`  | Slightly raised background       |
| Surface   | `#14141D`  | Cards, panels                    |
| Elevated  | `#1C1C27`  | Hover/active surfaces, mark depth|

## Text

| Token   | Hex        | Use                          |
|---------|------------|------------------------------|
| Ink     | `#ECECF1`  | Primary text                 |
| Muted   | `#9A9AAB`  | Secondary text               |
| Faint   | `#61616F`  | Tertiary / disabled          |

## Status

| Token    | Hex        |
|----------|------------|
| Success  | `#4ADE80`  |
| Warning  | `#FBBF24`  |
| Danger   | `#F87171`  |

---

## Usage rules

- **Backgrounds are dark by default.** Light/white layouts (invoices, formal
  documents) are allowed — use Base/Ink inverted: dark ink on white, brand
  colours unchanged for accents.
- **Neon is an accent, not a fill.** Large flat areas of cyan/violet read cheap;
  use them for the logo, edges, links, glows, and small emphasis.
- **Contrast:** Ink on Base passes AA. Cyan/Violet-Bright text needs a dark
  surface behind it; on white, use Violet `#7C3AED` (not the brights) for text.

These are the same tokens defined in the website at
`src/styles/global.css` (`@theme`, `--color-*`). Keep them in sync.
