← Back
Best viewed on a desktop. Please switch to a larger device.

VAPOR
WAVE
ÆSTHETIC

Born in early-2010s internet culture, Vaporwave draws on 80s corporate aesthetics, Japanese text, Lo-Fi digitisation, and the uncanny nostalgia of forgotten malls and dial-up connections.

2010s
Origin
Nostalgia
A E S
Signature
// GRADIENT PALETTE
Pink → Violet → Cyan
The vaporwave gradient trinity
// PERSPECTIVE GRID
The Floor Grid
CSS perspective + rotateX - infinite horizon aesthetic
// SLICED SUN
Gradient + Stripe Mask
The iconic striped half-circle in every composition
Colour

Vaporwave Palette

Deep violet backgrounds, neon pinks and cyans, warm peaches. The palette evokes a sunset seen through a CRT monitor.

Neon Pink
#FF6EC7
Primary glow accent
Violet
#A855F7
Secondary, gradients
Neon Cyan
#67E8F9
Contrast accent
Teal Mist
#2DD4BF
Success, status
Peach Glow
#FDBA74
Warm contrast
Deep Void
#0D0020
Page background
Type

Type System

Display VAPORWAVE 48px · Audiowide
+0.06em tracking
H1 / Hero A E S T H E T I C S 32px · Audiowide
spaced characters
H2 / Section Next Generation Sound 24px · Oxanium 700
Terminal / Label VHS_STATIC :: LOADING... ████░░░ 72% 13px · Space Mono
+0.12em tracking
Body Body in Oxanium Light - a geometric sans with just enough roundness to evoke the smooth curves of 80s industrial design. Clear, readable, subtly retro-futurist. 15px · Oxanium 300
1.75 line-height
Components

UI Components

// Buttons

// Input Fields

// Progress · Loading

SYNTHESIS 72%
MODULATION 55%
TRANSMISSION 88%
UPLOAD 41%
Glitch Text Effect
GLITCH SIGNAL
text-shadow offset creates RGB split
Navigation

Navigation Patterns

Cards

Card Patterns

A E S T H E T I C
Dream Pop

Lo-fi sampling of forgotten 80s radio. Every track an artefact recovered from corrupted VHS tape.

NEW WAVE
🌴
SIMULATION
Mall Walking

The uncanny experience of navigating an empty shopping centre at 2AM. Escalators moving for no one.

CONCEPT
🌐
NETWORK
Dial-Up Dreams

The 56k modem connection handshake as music. Analogue signal corruption as design language.

ARCHIVE
Layout

Full App Layout

LIVE
DASHBOARD
SIGNALS
🌴ARCHIVE
ALERTS (2)
SETTINGS

// TRANSMISSION LOG

4,821
Signals
↑ 12%
$48k
Revenue
↑ 8%
99.8%
Uptime
Nominal
2.4ms
Latency
↓ Fast

// TRANSMISSION VOLUME · 7 CYCLES

Principles

Core Principles

01 · CHROMA

Deep Void + Neon Glow

Near-black violet backgrounds are required - the neons only glow against true darkness. Every saturated colour earns its luminosity through contrast with the void behind it.

02 · DEPTH

The Perspective Grid

CSS perspective + rotateX creates the signature infinite horizon floor grid. Combined with the sliced gradient sun, it signals the Vaporwave world to the viewer instantly.

03 · SIGNAL

Glitch as Aesthetic

RGB colour splitting via text-shadow offsets, scan-line overlays, and deliberate pixel corruption are design tools - not errors. Imperfection is the point.

04 · NOSTALGIA

Corrupted Memory

The vaporwave palette and typography evoke the specific feeling of remembering a past that never quite existed - VHS artifacts, mall muzak, Windows 95 screensavers.