VAPORWAVE DESIGN SYSTEM · color = energy · calligraphy = structure · vapor = behavior
Vapor
1 · Color — energy
core palette
#FF71CE magenta
#01CDFE cyan
#B967FF indigo
#05FFA1 mint
#FFD319 sun
#1A0033 night
ionized neons
#DF73FF heliotrope
#14FFB1 viridian
#14F1D9 teal
#C9A6E0 lavender
#FF5D8F rose
#3A0CA3 cobalt
phase-shift gradients — colors condensing into one another
2 · Calligraphy — structure
written in gas, not ink
glyphs illuminated from within (subsurface glow) + ink-as-vapor feathering
3 · Vapor physics — behavior
thermal drift
diffusion
condensation node
particle drift
refractive shimmer (hover / focus)
shear-flow streak
Components
gradient text
:root { --vw-magenta:#FF71CE; --vw-cyan:#01CDFE; }
.title { text-shadow: var(--vw-subsurface); } /* glow from within */
.stroke{ filter: /* ink-as-vapor */ drop-shadow(0 0 6px #B967FF80); }
tokens → tokens/vaporwave.css · behavior → tokens/vapor-fx.css · export → tokens/vapor-print.css (VOID watermark) · data → tokens/vaporwave.tokens.json
To export: Ctrl/Cmd+P → "Save as PDF" · enable "Background graphics" to keep the neon + watermark.