# EDC Las Vegas design system

> Captured from https://lasvegas.edc.com/ on 2026-10-05 by Brooks New Media (https://design.brooksnewmedia.com/styles/edc-las-vegas/). An independent analysis for reference: EDC Las Vegas and its marks belong to their owner. Learn from the system; don't copy the brand.

## Overview

EDC sets a #000000 ground with white text, #b3b3b3 grey for secondary copy, and #ed3895 pink with #9333ea purple as the neon accents. Headlines use Posterama, a futurist geometric, at 28 to 48px uppercase, with Rajdhani and Aktiv Grotesk for body and labels. Buttons are solid pink with square corners and no radius anywhere.

- Theme: dark
- Mood: dark, neon, electronic, futurist, pink
- Category: Festival

## Colors

| Role | Hex | Use |
|---|---|---|
| Background | `#000000` | The page ground |
| Text | `#ffffff` | Primary ink, 21.0:1 on the background |
| Muted text | `#b3b3b3` | Supporting copy, 10.0:1 on the background |
| Accent | `#ed3895` | Primary actions |
| Border | `#ffffff` | Hairlines and dividers |

Full palette, most used first: `#000000`, `#ffffff`, `#ed3895`, `#9333ea`, `#b3b3b3`.

## Typography

- **Posterama-Bold**: display, 50.3% of the text. Use Orbitron. Posterama is a paid typeface. Orbitron is a free stand-in, not a match.
- **AktivGrotesk-Regular**: display and body, 17.3% of the text. Use Inter. Aktiv Grotesk is a paid typeface. Inter is a free stand-in, not a match.
- **Rajdhani**: display and body, 16.6% of the text. Use Rajdhani. Rajdhani is free under the SIL Open Font License.
- **AktivGrotesk-Bold**: display and body, 11.6% of the text. Use Inter. The bold cut of Aktiv Grotesk, a paid typeface. Inter is a free stand-in, not a match.

| Role | Family | Size | Weight | Line height | Tracking |
|---|---|---|---|---|---|
| Display | Posterama 1984 | 48px | 400 | 1.2 | 0 |
| Heading | Posterama-Bold | 28px | 400 | 1.2 | 0 |
| Subheading | AktivGrotesk-Regular | 20px | 400 | 1.6 | 0 |
| Body | Rajdhani | 16.8px | 400 | 5.06 | 0 |
| Small | AktivGrotesk-Bold | 12px | 400 | 3.17 | 0 |

Sizes in use, largest first: 48px, 45px, 32px, 28px, 20px, 17px, 14px, 12px.

## Spacing

No single base unit: the values below are what the page repeats.
Values in use: 10px, 15px, 20px, 50px, 64px.

## Shape

Corners are square throughout.

Shadows, most used first:

- `rgba(0, 0, 0, 0.2) 0px 1px 4px 0px`

## Components

### Primary button ("Buy Passes")

- Fill: #ed3895
- Text: #ffffff, 14px at weight 400
- Border: none
- Corner: 0px
- Height: 50px, padding 0px 25px

### Secondary button ("LEARN MORE")

- Fill: transparent
- Text: #ed3895, 14px at weight 400
- Border: 1px solid #ed3895
- Corner: 0px
- Height: 43px, padding 0px 10px

## Do

- Put neon pink and purple on pure black and nowhere else.
- Set headlines in a geometric uppercase face with a sci-fi feel.
- Keep every corner square.

## Don't

- Use a dark grey ground: the neon needs true black.
- Round the buttons.
- Let artwork compete with the ticket button's pink.

## CSS variables

```css
:root {
  --color-background: #000000;
  --color-text: #ffffff;
  --color-text-muted: #b3b3b3;
  --color-accent: #ed3895;
  --color-border: #ffffff;
  --font-display: "Posterama 1984", system-ui, sans-serif;
  --text-display: 48px;
  --weight-display: 400;
  --font-heading: "Posterama-Bold", system-ui, sans-serif;
  --text-heading: 28px;
  --weight-heading: 400;
  --font-subheading: "AktivGrotesk-Regular", "Inter", system-ui, sans-serif;
  --text-subheading: 20px;
  --weight-subheading: 400;
  --font-body: "Rajdhani", system-ui, sans-serif;
  --text-body: 16.8px;
  --weight-body: 400;
  --font-small: "AktivGrotesk-Bold", "Inter", system-ui, sans-serif;
  --text-small: 12px;
  --weight-small: 400;
  --space-1: 10px;
  --space-2: 15px;
  --space-3: 20px;
  --space-4: 50px;
  --space-5: 64px;
}
```

## Notes for AI coding tools

- Start from the CSS variables above and build components from them, not from new values.
- Use the font substitutes listed. Never embed a commercial or platform-only typeface without a license.
- Keep body text at 4.5:1 contrast or better against its ground.
- These values were measured from the live page at 1440x900; the site may have changed since 2026-10-05.