Digital native · 1982–present · Global / networked, North America, East Asia
Cyberpunk Visual Style
Also known as Cyberpunk aesthetic, Neon noir, High tech, low life look
A dystopian urban look of high technology and low life: night-city scenes in which neon signs, rain-slicked surfaces and glowing screens crowd a dark ground. Bilingual Latin and East Asian signage, grimy overload and green-cyan terminal glyphs mark it. It grew from Blade Runner, Akira and Neuromancer.
Make something in this style Get advice in this style Mix it with another style
Use it with care
Cyberpunk's East Asian cityscapes are often criticised as techno-Orientalism, which casts Asia as futuristic yet cold and dehumanising; Blade Runner and Neuromancer are both critiqued on these grounds. Do not use Japanese or Chinese script as exotic decoration or set meaningless characters on every sign; use real, correct text, and do not make Asian people or places the faceless backdrop of a dystopia.
01
How it works
- Set the scene at night and let neon signs and screens be the only light on a dark ground.
- Pack the frame with layered signage, wires, vents and adverts until the city feels overloaded.
- Mix Latin and East Asian scripts and invented corporate logos in the signage, but treat the script as real language, not exotic decoration.
- Keep the technology worn, dirty and wet; show grime and rain, never a clean showroom.
- Render interfaces as green or cyan monospace glyphs, scan lines and falling code over the street.
Film, comics and fiction of the early 1980s: Blade Runner (1982), Akira (manga 1982), Neuromancer (1984)
02
Its design choices
From Stylogeny’s vocabulary of design choices: defining choices make the style, characteristic ones are usual, occasional ones turn up now and then.
- Layout & composition
- Space & hierarchy
- Typography
- Colour
- Form & shape
- Surface & texture
- Ornament
- Imagery
- Medium & production
- Avoids
- Pastel, Light ground, Generous white space, Ornament-free, Floral & vegetal, Calm & contemplative, Warm & approachable, Nostalgic & retro, Script
Palette
-
#0b0c14 -
#ff2a6d -
#05d9e8 -
#39ff14 -
#7a1fa2 -
#d1a516
Typefaces
-
Japanese and Chinese neon signage characters beside Latin lettering
-
Monospace terminal type
-
Condensed corporate sans logotypes
Known for
-
Blade Runner
1982, dir. Ridley Scott
-
Akira
manga 1982, Katsuhiro Otomo; film 1988
-
Neuromancer
1984, William Gibson
-
Moebius and Dan O'Bannon, The Long Tomorrow
1976
-
Frank Miller, Ronin
DC Comics, 1983-1984
-
Ghost in the Shell
1995 film
-
Cyberpunk 2077
CD Projekt Red, 10 December 2020
03
Make something in this style
Say what you need, and Stylogeny’s image studio draws it from Cyberpunk Visual Style’s design choices and checks it against them. It takes about a minute, and you get a link to share.
04
Where it comes from, and what it’s close to
Before it
The style it grew out of, and the styles it borrowed from.
After it
The styles that grew out of it.
No later style in the atlas grew out of it yet.
Alike in its design choices
Styles that make many of the same choices, related or not, besides those above.
05
Often taken for
Cyberpunk Visual Style has no real works recorded yet, so these are its nearest styles by its choices alone, with the choices that tell them apart.
-
Fantasy User Interface (FUI) & Sci-Fi HUD
Fantasy User Interface & Sci-Fi HUD is one of Cyberpunk Visual Style’s nearest styles by choices; no real work of either fits the other better.
Choices that tell Cyberpunk Visual Style and Fantasy User Interface apart Choice Cyberpunk Visual Style Fantasy User Interface Eclectic mixing defining — Geometric primitives — defining Complementary clash characteristic — Diagram & data — defining Dynamic asymmetry characteristic — Cyberpunk Visual Style borrowed from Fantasy User Interface & Sci-Fi HUD, but neither descends from the other.
-
Media-Player & Desktop Skins (Winamp-Era Skinning)
Media-Player & Desktop Skins is one of Cyberpunk Visual Style’s nearest styles by choices; no real work of either fits the other better.
Choices that tell Cyberpunk Visual Style and Media-Player apart Choice Cyberpunk Visual Style Media-Player Eclectic mixing defining — Framed panels — defining Dynamic asymmetry characteristic — Chrome & 3D render — defining Full bleed characteristic — No shared descent in the atlas: they reached these choices separately.
-
Acid Graphics / New Ugly
Acid Graphics / New Ugly is one of Cyberpunk Visual Style’s nearest styles by choices; no real work of either fits the other better.
Choices that tell Cyberpunk Visual Style and Acid Graphics apart Choice Cyberpunk Visual Style Acid Graphics Layered information defining — Chrome & 3D render — defining Horror vacui defining occasional Experimental & distorted — defining Complementary clash characteristic — No shared descent in the atlas: they reached these choices separately.
-
Rave & Acid House Graphics
Rave & Acid House Graphics is one of Cyberpunk Visual Style’s nearest styles by choices; no real work of either fits the other better.
Choices that tell Cyberpunk Visual Style and Rave apart Choice Cyberpunk Visual Style Rave Complementary clash characteristic — Emblems & badges — defining Angular & zigzag characteristic — Gradients occasional defining Dynamic asymmetry characteristic — No shared descent in the atlas: they reached these choices separately.
— means the choice isn’t among the style’s recorded choices. Critics recorded each work’s choices with the styles’ descriptions in view, so this shows whether the descriptions hold together, not proof that they are right.
06
Combine it with
Styles Cyberpunk Visual Style pairs well with or plays against, from the research. Each is worked out as a combination: which style gives the type, the colours and the forms.
- Glitch Art & Datamosh Graphics Pairs well · Add signal tearing and scan-line breakup to suggest a failing, overloaded network.
- Vaporwave Contrasts · Its pastel, ironic calm (pastel is core to its palette) against cyberpunk's dark, hostile density makes a useful opposite.
- Synthwave / Outrun Contrasts · Swap the sunset grid and chrome nostalgia for rain and grime to turn retro glow into dystopia.
- Fantasy User Interface (FUI) & Sci-Fi HUD Pairs well · Lay HUD overlays and glyph streams over a street scene to carry the screen layer inside the city.
07