Vaporwave
Purple-pink-blue, marble busts and deliberate glitch – a music microgenre's visual language, constructed to look artificial on purpose.
Read the entryVaporwave
Purple-pink-blue, marble busts and deliberate glitch – a music microgenre's visual language, constructed to look artificial on purpose.
Lineage: Born of an early-2010s music microgenre (Chuck Person's Eccojams Vol. 1, August 2010); the visuals grew from the scene's own album art.
bg-page
bg-raised
text-primary
text-secondary
accent-solid
on-accent
radius · shadow
Aathe type voice
A working sample – the controls are live (hover, press, focus, the toggle's two states) and everything inside the frame is painted by the token block shown in the recipe below. Nothing saves anything; "Advanced options" jumps to the recipe. The page around the frame stays in Atlas's own system.
Spot it
A signature purple/pink/blue palette – distinct from Y2K's silver-chrome-first palette.
- deep violet ground
#241b52 - raised violet
#342667 - hot pink
#ff71ce - cyan
#6de5ff - pale pink ink
#ffeaf8
- deep violet ground
1990s web imagery deployed knowingly: Windows dialog boxes, floppy disks, pixelated pop-ups.
Generated with Gemini from this entry's own prompt vocabulary – the copyable brief doing its job. Greco-Roman marble bust statuary as a recurring, near-mandatory motif.
Generated with Gemini from this entry's own prompt vocabulary – the copyable brief doing its job. - Palm trees and Japanese/Chinese text used decoratively, as visual texture – itself a contested, somewhat exoticising element worth being aware of.
- City-skyline and mall imagery evoking "liminal space" nostalgia.
- Deliberately degraded visuals – glitch artefacts, unnatural colour shifts, VHS-style distortion – applied on purpose to otherwise-clean imagery, signalling artificiality rather than hiding it.
A marble bust under a neon sunset, scan-lines across the whole thing: instantly recognisable, deliberately fake. Vaporwave is the one entry in this catalogue that began as music – the founding text is Chuck Person’s Eccojams Vol. 1 (August 2010), packaged to resemble the 1993 game Ecco the Dolphin, built from chopped, slowed, reverb-heavy samples of 80s-90s smooth jazz and lounge. The visual style grew out of that scene’s own album art, not out of web design.
Naming the marble bust is unusually high-leverage in a brief – it’s the single most recognisable, most frequently generated vaporwave signifier, more so than the palette itself. The card above obliges. And its type is a deliberate non-choice: the name is set in your system’s own Times italic, because knowingly-kitsch default faces are part of the vocabulary – loading a designed webfont here would be less authentic, not more (the same reasoning as web brutalism’s raw stack, recorded in ADR #024).
Where it came from
Music-first, as above – and with a genuine, traceable ancestor inside this catalogue: vaporwave’s geometric shape vocabulary explicitly borrows from Memphis Milano, a real cross-pollination rather than coincidental resemblance. The subculture also carries an ambiguous-to-satirical relationship with consumer capitalism and 80s-90s corporate imagery, which separates it philosophically from straightforward Y2K nostalgia (generally unironic).
When it fits
Music, entertainment, indie brand identity – anywhere a knowing, slightly ironic nostalgia beats sincere retro warmth. The bust-plus-glitch combination specifically signals “this is a constructed aesthetic, not an accident”.
When it’s wrong
This is one of the least production-UI-applicable styles in the catalogue: it essentially never appears as a working product’s actual interface – only as marketing and brand surfaces, album art, or standalone pieces. Forcing it into functional UI risks the aesthetic overwhelming usability entirely.
Don’t confuse it with
Retro/Y2K – the sincere sibling: silver chrome, unironic optimism, web-design-first origins. Memphis – the ancestor whose squiggles and geometry vaporwave still quotes; see that entry for the lineage in the other direction.
The recipe
The actual scope from style-scopes.css – the CSS that painted the stage above.
/* ===== style: vaporwave ===== */
/* Music-first nostalgia: purple-pink-blue, marble busts, knowing 90s
kitsch – default faces used deliberately, glow instead of shadow. */
[data-style='vaporwave'] {
--bg-page: #241b52;
--bg-raised: #342667;
--bg-active: #43317f;
--border-default: #8d76c9;
--border-hover: #ab97dd;
--border-input: #8d76c9;
--text-primary: #ffeaf8;
--text-secondary: #d9c1f0;
--accent-solid: #ff71ce;
--accent-solid-hover: #ff9edd;
--accent-text: #6de5ff;
--on-accent: #33063f;
--radius-s: 2px;
--radius-m: 4px;
--radius-l: 6px;
--shadow-1: 0 0 24px rgba(255, 113, 206, 0.35);
--shadow-2: 0 0 34px rgba(109, 229, 255, 0.4);
--font-sans: 'Times New Roman', Times, serif;
}
[data-style='vaporwave'] .sty-name {
font-style: italic;
letter-spacing: 0.14em;
text-transform: uppercase;
}
[data-style='vaporwave'] .sty-art {
background-image:
radial-gradient(circle at 74% 34%, #ffd23f 0 12px, #ff9e5e 13px 18px, rgba(255, 158, 94, 0) 19px),
linear-gradient(180deg, #2c1f63 0%, #4a2f86 55%, #c34f9b 100%);
border: none;
}
/* The perspective grid – the horizon half of every vaporwave sunset. */
[data-style='vaporwave'] .sty-art::after {
content: '';
position: absolute;
inset: auto 0 0 0;
height: 52%;
background:
repeating-linear-gradient(90deg, rgba(255, 113, 206, 0.55) 0 1px, transparent 1px 18px),
repeating-linear-gradient(0deg, rgba(255, 113, 206, 0.55) 0 1px, transparent 1px 12px);
transform: perspective(140px) rotateX(52deg);
transform-origin: 50% 100%;
}
/* The bust – the style's most recognisable signifier, drawn as an
original SVG silhouette (ADR #006: reconstructions, never assets). */
[data-style='vaporwave'] .sty-art .sty-art-a {
inset: 14px auto auto 16px;
width: 56px;
height: 74px;
border-radius: 0;
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 84'%3E%3Cpath fill='%23f2ecfa' d='M32 2c-9 0-15 7-15 16 0 6 2 10 5 13-1 5-4 8-9 10-6 2-9 6-9 13v18h56V54c0-7-3-11-9-13-5-2-8-5-9-10 3-3 5-7 5-13 0-9-6-16-15-16z'/%3E%3Cpath fill='%23c9b8e8' opacity='.55' d='M26 5c7 2 11 8 11 13 0 6-2 10-5 13 1 5 4 8 9 10 6 2 9 6 9 13v18h10V54c0-7-3-11-9-13-5-2-8-5-9-10 3-3 5-7 5-13 0-9-6-14-21-13z'/%3E%3Crect fill='%23f2ecfa' x='8' y='76' width='48' height='8'/%3E%3C/svg%3E")
no-repeat center / contain;
opacity: 1;
}
[data-style='vaporwave'] .sty-art .sty-art-b,
[data-style='vaporwave'] .sty-art .sty-art-c {
display: none;
}
/* Hover: the sunset saturates – degradation lifting for a moment. */
.sty-card[data-style='vaporwave']:hover .sty-art {
filter: saturate(1.35);
}
/* ===== end vaporwave ===== */Prompt vocabulary
Meant to be copied, not paraphrased – anchors beat adjectives when briefing an agent.
- vaporwave
- purple-pink-blue palette
- Greco-Roman marble bust motif
- glitch/VHS distortion overlay
- 1990s web iconography (Windows dialog chrome, floppy disks)
- palm trees
- deliberately degraded/artificial colour grading
Exemplars
Named links out – the vignettes above are reconstructions, never screenshots (ADR #006).
- Album art, fashion and gaming – Nike, JW Anderson and Louis Vuitton have all shipped vaporwave-influenced pieces; Hotline Miami, Sunset Mall and Data Wing carry the gaming lineage
- Spider-Man: Into the Spider-Verse – draws visibly on the same glitch/neon/collage language