Cyberpunk Holo City

About this style

Cyberpunk took shape in 1980s science fiction, from the film Blade Runner (1982) to William Gibson's novel Neuromancer (1984), imagining dense, rain-soaked cities where high technology meets street life. Its screen look is a narrow street at night: wet asphalt reflecting signs, steam, crowded signage, holographic advertising and flying vehicles overhead. Games, anime, films and music videos have kept it alive, and motion designers use it for title sequences, game trailers and night-city loops.

Make a 10-second cyberpunk street at night: rain falls into a narrow street canyon, wet asphalt mirrors the signs, steam drifts through colored light, a hologram koi circles a tower and an air taxi passes low overhead.

<inputs>
If I don't give you something, use the default and don't ask.
- Place: Ward 7 Night Market, Kessan City (fictional).
- Title: "WARD 7"
- Line: "Night market · open till the rain stops"
- Hologram: a koi for Saffron Koi Tea House (fictional), with the panel "SAFFRON KOI · TEA HOUSE".
- Shop signs, all fictional: NOODLE 24 · TESKAR PHARMACY · DUMPLING 88 · ROOM 404 KARAOKE · KESSAN TRANSIT · HOTEL ORBA · OPEN · REPAIRS · TEA · LATE BAR
- Vehicle: an air taxi marked "KT-9".
- Length: 10 seconds.
</inputs>

<direction>
- Look: a rain-soaked street canyon at night, filmed low from the middle of the road: wet asphalt mirroring every sign, steam rising through colored light, holograms, and a flying taxi passing overhead. The color avoids the usual magenta and cyan: sodium-amber streetlights, jade and lilac holograms and one vermilion sign, all floating in a petrol-blue haze.
- Palette: haze #123138 thickening to #1C4A50 toward the far end of the street; building concrete #2B3438, lit #4E5A5C, wet black #0B1012; sodium lamps #FF9A3D with light pools #FFB866; holograms jade #34F5B8 and lilac #C3A2FF; signs vermilion #FF4A2E, warm white #FFE9C7 and amber #FFB13B; asphalt #0E1416; rain streaks #BFD8D8 at 35%; steam takes the color of the nearest light. Nothing is pure black: the darkest wall reads at about 8% brightness, held up by haze and bounce light.
- The street (1 unit = 1 m): straight, 12 wide and 120 long, with 2.5-unit sidewalks and curbs. Buildings of 18–60 units rise on both sides as stacked boxes with setbacks, each facade a generated CanvasTexture window grid (seeded lit windows, blinds, a few warm interiors), carrying real 3D clutter: balconies, AC units (boxes with fan grilles), fire escapes, sagging overhead cables strung across the street (TubeGeometry catenaries), vertical blade signs on brackets (lit boxes 1 × 4), awnings over lit shopfronts, a food stall with a striped awning and a steaming pot, and sodium lamp posts every 14 units with glowing heads.
- Signs: the ten signs from the inputs on blades, awnings and facades, their lettering drawn into CanvasTextures in Teko 600, Bebas Neue 400 and Pacifico 400 (Latin letters only), emissive at 1.5–3.0, each lighting its surroundings with a matching PointLight (decay 2) or a soft glow decal on the wall around it. Signs warm up once, ramping from 20% to full over 0.4 s; afterward a sign may dip by at most 15%, never more than once a second, and none flash.
- Hologram koi: a translucent koi 14 units long swimming a slow loop around a hologram emitter on the corner tower at the right, about 25 units up. Its body is a tapering swept tube along a spine that undulates as a traveling wave; long flowing fins and a split tail are planes with fin-ray lines; two barbels trail from its mouth. ShaderMaterial, additive, depthWrite false: a jade fill at 25% with brighter Fresnel edges, horizontal scanlines 6px apart drifting upward, fin rays and a scale pattern in lilac lines, and a gentle instability (brightness dips of at most 15%, no more than twice a second, and a 0.06-unit slice-offset glitch no more than once every 1.5 s). A faint additive projection cone rises from the emitter, and a hologram panel beside it reads "SAFFRON KOI · TEA HOUSE" in Teko 600.
- A second hologram: a tall lilac panel on the left building cycling three ads (a steaming cup, "OPEN TILL DAWN", a noodle bowl), each sliding in horizontally every 2.4 s, with the same scanline treatment.
- Rain: 9,000 streaks (LineSegments) falling at 9 units/s with a slight wind slant, each 0.3–0.6 long, lit additively by a cheap function of position (amber near lamp posts, jade near the koi, warm white elsewhere); y(t) = y₀ − v·t wrapped by the column height, so any frame is direct. On the road, 300 seeded splash rings, each recurring on its own period of 0.8–1.6 s at a fresh seeded spot, grow from 0 to 0.25 units over 0.4 s as they fade, each with a few droplets thrown up on short arcs.
- Wet road: a Reflector (three/addons/objects/Reflector.js) under the asphalt with a custom shader: the reflection is distorted by a ripple normal built from the splash rings and fine noise, then mixed with the asphalt through a puddle mask, nearly clear (85%) in the puddles and a rough smear (35%, a few offset samples averaged) on bare asphalt; worn lane markings #C9C2A0 break it up.
- Steam: from a manhole in the road 18 units ahead and from the food stall, 40 billboarded soft noise puffs per source that rise at 0.6 units/s, swell and fade over 3 s, tinted by the lights they pass (amber near lamps, jade near the koi).
- Air taxi: a wedge body 4.5 long with a bubble canopy, four ducted fans in rings at its corners (each with a spinning blade disc and a warm glow inside the duct), a warm white light bar along its nose, "KT-9" on its flank, and red and green navigation lights that blink once per second. It enters from the far end of the street at 30 units altitude, descends to 12 as it passes over the camera (5.6–7.4 s) with its headlight cone sweeping the wet street, and its downwash flattens the steam and pushes the rain streaks sideways for a moment.
- Light: FogExp2 #123138 at density 0.018; a HemisphereLight #2C5A60 / #0B1012 at 0.6 so walls never fall to black; a SpotLight under each lamp head (intensity 40, angle 50°, penumbra 0.6) making amber pools; a dozen PointLights for the big signs; no shadow maps. ACESFilmic, exposure 1.25. Post: EffectComposer with UnrealBloomPass (strength 0.6, radius 0.5, threshold 0.7) so only signs, holograms and lamp heads bloom, then OutputPass.
- Camera: fov 40, starting 0.35 above the road (puddle level) in the middle of the street, rising to 1.7 and dollying 14 units forward by 5.0 s on easeInOutSine with a slow 4° pan right toward the koi; as the taxi passes it tilts up 18° to follow and settles back to a level hero view by 8.0 s. No shake.
- Type (HTML over the canvas): the title in Oxanium 700, 128px, tracked 0.06em, #FFE9C7, baseline at (120, 900); the line in Sora 400, 26px, #BFE9E2, beneath it; a soft #0B1012 scrim at 45% feathered behind both so they read over the reflections.
- Premium: wet surfaces that mirror every light, haze that gives depth, holograms that feel projected (scanlines, Fresnel edges, a light cone), rain that catches the light, a taxi built from real parts. Cheap: magenta and cyan neon on black boxes, glow on everything, a flat grid street, strobing signs.
Banned: a magenta-and-cyan palette, pure black areas, strobing or rapid flicker, any sign or light changing brightness more than twice a second, real brands, decorative use of real writing systems, people or faces, weapons, lens flares, chromatic aberration, camera shake, anything flashing more than 3 times per second.
</direction>

<structure>
- 0.0–1.6s: low at puddle level: rain splashes ripple a mirror of amber lamps and the nearest signs; steam drifts through the light; the camera begins to rise.
- 1.6–3.4s: the dolly moves down the street; the signs farther along both sides warm up one by one; rain streaks catch their colors.
- 3.4–5.6s: the koi swims out from behind the corner tower and loops around its emitter; the lilac panel slides to its next ad; the camera pans toward the koi.
- 5.6–7.4s: the air taxi descends out of the haze at the far end and passes low overhead, its headlight sweeping the wet street and its downwash flattening the steam; the camera tilts up to follow it and back. The 6.0 s frame shows the taxi coming down the street toward us, lights on, the koi and the signs behind it.
- 7.4–8.6s: the camera settles level; the title and line rise 12px as they fade in at the bottom left.
- 8.6–10.0s: hold: the camera is still; the rain, the steam and the koi keep moving.
For other lengths, stretch the dolly and the koi's loop; keep the taxi pass at 1.8 s and at least 1 s of hold.
</structure>

<build>
- One self-contained index.html (inline CSS and JS), a 1920×1080 (16:9) stage scaled to fit the window, designed for 60fps. No image, video, texture or model files: every shape and texture is generated in code.
- window.seek(t), t in seconds, computes every visual from t alone: no CSS transitions or CSS animations, no setTimeout/setInterval, no state carried between frames, randomness only from a seeded PRNG. Anything cumulative is solved analytically from t or precomputed once at load at a fixed step. Past the end, seek clamps to the last frame.
- Without ?render in the URL, drive seek from requestAnimationFrame so it plays in a browser (loop after a 1s end hold); with ?render, don't start that loop.
- Google Fonts via <link> are fine; await document.fonts.load() for each face before defining window.seek.
- Engine: three.js as an ES module pinned to three@0.160.0 through an import map on jsDelivr (`three` and `three/addons/`). WebGLRenderer with antialias, preserveDrawingBuffer: true and setPixelRatio(window.devicePixelRatio); render once at the end of every seek. Text is HTML over the canvas.
- Call composer.render() once per seek in place of renderer.render(). The camera, the taxi, the koi's spine wave and loop, rain, splashes, steam and every sign's brightness are closed-form functions of t from seeded data; the city is built once at load from a seeded PRNG, and sign and facade CanvasTextures are drawn after the fonts load.
</build>

<check>
Before showing me, step through one frame per second (t = 0…10): screenshot each and look at it. Fix overlaps, clipped or cramped text, and anything off-style or Banned. Check the street is readable from the first frame (walls never black, haze giving depth), the wet road mirrors the lamps and signs with ripples, the palette stays amber, jade, lilac and vermilion with no magenta-and-cyan cast, no sign or hologram changes brightness more than twice a second, the koi reads as a koi with fins and barbels, the taxi reads as a vehicle with ducted fans, the title is legible over its scrim, and the 6.0 s and final frames are complete. Confirm seek(10) and seek(11) match, so the final frame holds.
</check>

Ours, and free to use under CC0: copy it, change it, ship it. No credit needed.

Similar prompts

Low-Poly Landscape Flyover

Made by us

A slow golden-hour glide down a faceted valley: flat-shaded ridges, a low sun, fog melting the far range into the horiz…

Keynote Product Reveal

Made by us

A device built in three.js rises out of total darkness while a softbox reflection glides along its titanium edge, then…

Isometric Miniature City

Made by us

A toy-like isometric city block that builds itself on a floating slab: bevelled buildings rise floor by floor, cars loo…

Extruded 3D Type

Made by us

Chunky two-tone 3D letters swing into place one by one on a seamless studio sweep, lit like a product shot with soft sh…