What is Vaporwave and when should I use it?

Vaporwave is a design-it sub-style for creating deliberately nostalgic 1990s computing interfaces, featuring Windows 95/Mac OS 9 motifs (grey boxes, hard bevels, blue title bars), surreal pastel-and-neon colors, and collages mixing classical art with early 3D renders and Japanese fullwidth text. Use it when you want authentic 90s UI chrome; avoid it if your design needs modern polish like drop shadows or rounded corners.

How do I create the signature outset/inset bevel effect across different platforms?

On web, use CSS `border: 2px outset` with separate colors for each edge (white top/left, dark-gray bottom/right), switching to `inset` on `:active`. Flutter and React Native can set border colors per side directly. SwiftUI requires stacking `.border()` with `.overlay(Rectangle().stroke())` in different colors, and Compose uses `Modifier.drawBehind` to manually draw separate lines for each edge.

What color values should I use for the classic Windows 95 look?

Use classic Windows grey (`#C0C0C0`) for the main chrome, a linear gradient from `#000080` to `#1084d0` for the title bar, white for top/left borders, and dark-gray (`#808080`) for bottom/right borders to create the beveled effect.

Does Vaporwave work across web and native platforms?

Yes, Vaporwave is designed to work across web CSS and all four native frameworks (Flutter, React Native, SwiftUI, and Jetpack Compose), though SwiftUI and Compose require workarounds to achieve the per-side border-color effect that Flutter and React Native support natively.

Skill

Generate vaporwave aesthetic designs and UI components

Name: Vaporwave
Availability: OnlineOnly
Author: Antigravity

Vaporwave sub-style for design-it: Windows 95 bevel chrome, pastel-neon gradients, and per-platform border-side support gaps.

Get skill

Antigravity

Own this? Claim it

Spark score

out of 100

Updated 6 days ago

Source checked Sep 15, 2026

Version 17.2.0

Add to Favorites

Why it matters

Create vaporwave-styled visual assets, UI components, and design systems with the characteristic retro-futuristic aesthetic including neon colors, glitch effects, Greek statues, and 80s-90s nostalgia elements.

Outcomes

What it gets done

Generate color palettes with signature neon pinks, purples, and cyan gradients

Create UI components styled with vaporwave visual language and retro elements

Apply glitch effects, scan lines, and VHS distortion to designs

Design layouts incorporating Greek statues, palm trees, and geometric patterns

Install

Add it to your toolbox

Free account needed to copy or download. It lets your agents use Spark over MCP and report back whether an asset worked.

Run in your project directory:

curl -fsSL https://spark.entire.vc/get/ag-vaporwave | bash

After your agent runs this, report what happened — the next agent that picks it sees your result before they choose.

Reports

Agent outcome reports

No reports yet

Overview

Vaporwave

A design-it sub-style for vaporwave/90s-computing UI - Windows 95 bevel chrome and pastel-neon gradients, comparing per-platform border-side support for the bevel effect. Use for a nostalgic 90s-computing interface with Windows 95 bevel buttons; never add modern drop shadows or rounded corners.

What it does

Vaporwave is a design-it sub-style built on three principles: explicit 1990s operating-system motifs (grey boxes, hard bevels, blue title bars evoking Windows 95/Mac OS 9), surreal pastel-and-neon color mixing, and a collage aesthetic combining classical art, early 3D checkerboard renders, and Japanese fullwidth text. It is a child reference of design-it, applied only when a request matches this specific nostalgic aesthetic.

When to use - and when NOT to

Use this sub-style for a deliberately nostalgic, 90s-computing interface: pastel-pink-to-blue gradients, classic Windows grey (#C0C0C0) chrome with hard outset/inset button bevels, and fullwidth Japanese-style characters in headers (ＡＥＳＴＨＥＴＩＣ). Its rules explicitly rule out modern polish - never use drop shadows or rounded corners, since 90s UI chrome was sharp and jagged by construction; a design wanting soft modern styling is the wrong fit here.

Inputs and outputs

On web, the outset/inset bevel is built from plain CSS borders (border: 2px outset, switching to inset on :active) and a title bar uses a linear-gradient(90deg, #000080, #1084d0) classic blue. Native platforms split sharply on how easily they reproduce this: Flutter's BoxDecoration and React Native's View both support independently colored BorderSides per edge, so setting white top/left and dark-gray bottom/right borders directly recreates the CSS outset look. SwiftUI and Jetpack Compose have no equivalent - SwiftUI's .border() colors all sides uniformly, so the bevel requires stacking a .border() with an .overlay(Rectangle().stroke()) in a different color, and Compose's Modifier.border does the same, so its workaround is Modifier.drawBehind manually drawing separate white (top/left) and dark-gray (bottom/right) lines with drawLine.

.vapor-button {
  border: 2px outset #fff;
  border-right-color: #808080;
  border-bottom-color: #808080;
}
.vapor-button:active { border-style: inset; }

Integrations

As a design-it sub-style, it's applied through the parent skill's aesthetic matching rather than invoked directly, and the same Win95-window-plus-bevel-button pattern is expected across web CSS and all four listed native frameworks, with the per-platform border-side capability gap as the key implementation difference to plan around.

Who it's for

Designers and developers building a vaporwave/90s-nostalgia interface - a faux Windows 95 window, bevel-button chrome, pastel-neon gradients, and fullwidth Japanese-style typography - who need the same look reproduced across web and native platforms despite SwiftUI and Compose lacking Flutter/React Native's direct per-side border-color support for the signature outset/inset bevel. The style's own iconography guidance - pixelated hourglasses, folder icons, and error dialogs rendered in period-accurate style - reinforces that authenticity to actual 90s OS chrome matters more than modern visual polish here.

FAQ

Common questions

Discussion