Vaporwave
蒸汽波
Aliases:蒸汽波蒸汽波风格粉紫蓝复古未来霓虹网格地平线80年代商场美学vaporwavesynthwave UIretro mall aesthetic
What is it
Neon pink-cyan-purple, a perspective grid horizon, retro 3D chrome type and palm silhouettes as consumer-nostalgia look. It collages 80s-90s mall culture, early CGI and signal glitch — sweet, hazy, hollowly optimistic.
Design spec
Typography
Chrome-gradient display type plus wide-tracked sans
Color
Pink #FF71CE, cyan #01CDFE, violet #B967FF
Border
1px neon rims, pills and hard corners mixed
Shadow
Multi-layer same-hue neon glows
Spacing
Centered symmetric horizon, elements floating over the grid
Motion
300–400ms neon warm-up and horizon glide; honour prefers-reduced-motion
States
Hover strengthens the layered neon glow; focus shows a visible cyan ring; active lowers saturation; disabled loses glow and opacity; error uses pink neon
Style in action
See the full page, then try the interactive sceneFull-page preview
WELCOME TO
THE MALL
An endless summer in a consumer paradise.
GRID FOREVER. SUNSET NEVER ENDS.
Enter the atrium →Perspective to infinity
Liquid metal
Signature colors
Interactive scene
Loading demo…
✓ When to use
- Music, club, streetwear and retro events where style is the mood
- Campaign pages that must signal subculture and haze
- Players, tickets and virtual goods in entertainment contexts
✕ When not to use
- Finance, healthcare and civic UIs that must stay calm and trustworthy
- Long reading and form entry — neon and flicker drain attention
- Accessibility-critical contexts — pink-purple contrast and flicker are risky
Variants
Mall soft
商场软调
Pastel marble, Greek columns and Win95 chrome — sweet and hollow
Neon glitch
霓虹故障
Pink-cyan neon with RGB offset and scanlines, signal unstable
Holographic chrome
全息镀铬
Liquid-metal 3D type with CD-rainbow sheen
Implementation
linear-gradient 粉紫青perspective + rotateX 网格地平线background-clip: text 镀铬字text-shadow 多层霓虹repeating-linear-gradient 扫描线The grid horizon is the signature: a perspective container holding a rotateX(70deg) repeating-linear-gradient plane, faded at the bottom. Chrome type is a multi-stop grey or pink-cyan gradient via background-clip: text with a dark outline. Neon is multi-layer same-hue text-shadow; lock the hue set to pink #FF71CE, cyan #01CDFE, violet #B967FF. Palm and column silhouettes as one or two stickers. Glitch stays brief and rare, respecting prefers-reduced-motion.
Agent prompts
Four prompt layers run from “what it is” all the way to a ready-to-run task. On the Agent task layer you can stack a visual style and extra requirements, then copy it to your coding agent in one click.
Implement Vaporwave visual style in the current project. Inspect the existing theme and motion systems first; scope the Vaporwave palette and effects independently. Requirements: - Pink-purple-cyan neon palette + perspective grid horizon + chrome display type - Palm/column silhouettes limited to one or two accents - Scanlines at opacity ≤ 0.06; glitch brief and rare, respecting prefers-reduced-motion - Body text contrast compliant; neon is accent-only - Dark-first, with light mall-soft as a variant - No new dependencies Run existing project checks when done and list the modified files. Additional requirements: - Dark mode support - Respect prefers-reduced-motion - No new dependencies - Run existing checks and list modified files
Hand to your coding agent — stack a style and extra requirements on top
Related concepts
A visual language reviving turn-of-the-millennium digital optimism: liquid chrome, iMac translucent candy plastics, bubble type, sparkle stars, and pink-purple-blue gradients on silver highlights. It mixes naive futurism with clumsy low-poly 3D — sweet, shiny, gloriously unrestrained.
StylesSimilar"High tech, low life" as a visual language: neon cyan and magenta edges cut through a near-black ground, monospace type and terminal glyphs run throughout, and scanlines plus glitch offsets suggest overloaded systems. Light is sliced out of darkness — the screen feels hijacked.
StylesSimilarThe future as imagined by the past: cream-orange-brown warm palettes, chunky rounded casings, orbit lines and planet decals, pixel screens and CRT phosphor — optimistic tech that has aged. Space-age dashboards, vintage appliances and space-race posters fold into one warm nostalgic future.
StylesSimilarThe postmodern anti-functionalist language: squiggles, dots, zigzags and confetti spots in saturated clashing colors with bold black outlines, deliberately breaking grids and order. It embraces the cheap and the festive — happily ugly against modernist good taste.
StylesSimilarA self-contained rectangular container outlined by rounded borders or a surface colour, aggregating related content: cover, title, excerpt and actions. The universal display unit of content feeds, dashboards and commerce lists.
ComponentsAffectsA clickable block that triggers one clear action — the most basic interactive element of any interface. Fill, outline and ghost styles rank primary against secondary actions; presses give instant sink-in feedback, and a busy state disables further clicks to prevent double submission.
ComponentsAffects