Style Library

Neon Tokyo

Stylemodern

Tokyo Kabukicho neon nightscape style with rain-slicked street reflections, layered neon signage, and cyberpunk urban night vibes. Unlike cyberpunk-neon's sci-fi feel, this leans toward authentic urban nightscapes.

#ff1493
#0a0a1a
#00f0ff
#ff6b00
#bc13fe
#97b6ff

Preview

A sample page drawn from this style’s tokens — a guide to the look, not the exact output.

New · weekly review

Plan the week in ten minutes

Pull in every task, see what matters, and share one clear plan with the team.

Get startedSee how it worksDocs
Tasks done1,284+12% this week
Sign in
Emailyou@example.com
Remember meContinue
Today
Review roadmapDone
Ship onboardingIn progress
Team sync3 pm
Prompt
Paste into any AI assistant before describing what to build — or attach it to a project below.
# Visual style: Neon Tokyo

Tokyo Kabukicho neon nightscape style with rain-slicked street reflections, layered neon signage, and cyberpunk urban night vibes. Unlike cyberpunk-neon's sci-fi feel, this leans toward authentic urban nightscapes.

## Philosophy
Neon Tokyo draws inspiration from the neon nightscapes of Tokyo's Kabukicho, Shinjuku, and Shibuya. Unlike Cyberpunk Neon's sci-fi futurism, this style is closer to authentic urban nightscapes -- rain-soaked streets reflecting layered neon signs, warm and cool colors intertwining on wet asphalt.

Core concepts:
- Urban nightscape: A near-black deep blue-gray base simulating Tokyo's late-night city skyline
- Neon signage: Multi-color neon lights layered together, with pink, cyan, orange, and purple flickering in alternation
- Wet reflections: Elements carry a subtle reflective quality, like neon reflections on rain-slicked streets
- Layered depth: Bright foreground and dark background, simulating the visual depth of city alleyways

The key difference from Cyberpunk Neon: Neon Tokyo is warmer, more organic, and closer to real photography aesthetics. It does not pursue cold technological vibes but instead captures the lonely romance of a late-night wanderer in a neon jungle.

Suitable for: nightlife apps, music streaming, streetwear brands, urban photography portfolios, Japanese izakaya menus.

## Do
- Use deep night blue-black background bg-[#0a0a1a] or bg-gradient-to-b from-[#0a0a1a] to-[#12041e]
- Neon pink text text-[#ff1493] with glow [text-shadow:0_0_10px_rgba(255,20,147,0.6)]
- Alternate multi-color neon borders border-[#ff1493], border-[#00f0ff], border-[#ff6b00]
- Enhance neon glow on hover hover:shadow-[0_0_30px_rgba(255,20,147,0.5)]
- Use sans-serif bold fonts paired with Japanese kana decorative elements
- Add semi-transparent card backgrounds bg-[#0a0a1a]/80 backdrop-blur-md to simulate glass reflections
- Gradient text effect bg-gradient-to-r from-[#ff1493] to-[#00f0ff] bg-clip-text text-transparent
- Use multi-layered box-shadow to simulate neon tube glow diffusion

## Don't
- Do not use white or light backgrounds
- Do not use low-saturation, dull colors
- Do not use regular shadows shadow-md (must be colored glow shadows)
- Do not use soft gradients (such as soft pink, pale blue)
- Do not use serif fonts (except as Japanese decorative elements)
- Do not use overly neat, corporate layouts
- Do not use single-color neon (must be multi-color interweaving)

## Rules for the AI
STYLE: Neon Tokyo
TYPE: Urban nightscape interface

MUST USE:
- Dark night sky background: bg-[#0a0a1a]
- Multi-color neon glows (not single-color)
- Primary pink: text-[#ff1493], border-[#ff1493]
- Cyan accent: text-[#00f0ff]
- Warm neon: text-[#ff6b00]
- Purple neon: text-[#bc13fe]
- Glow shadows with color: shadow-[0_0_20px_rgba(255,20,147,0.5)]
- backdrop-blur for glass/reflection effect
- font-bold uppercase tracking-wider for labels
- rounded-sm for subtle edge softness

MUST AVOID:
- Light/white backgrounds
- Low saturation or muted colors
- Regular shadows (shadow-md)
- Serif fonts (except for Japanese decorative text)
- Single-color neon palettes
- Corporate or overly clean layouts

COLOR RULES:
- Neon Pink: #ff1493 (primary)
- Night Sky: #0a0a1a (background)
- Cyan Neon: #00f0ff
- Warm Neon: #ff6b00
- Purple Neon: #bc13fe

DIFFERENCE FROM CYBERPUNK-NEON:
- Warmer, more organic feel
- Multi-color neon mixing (not cyan-dominant)
- Street photography aesthetic, not sci-fi
- Wet reflections, not scan lines

## Animation & Interaction Rules

- Rain-Slicked Reflections: Bottom reflection gradients should intensify on hover with higher opacity and mixed-color refraction.
- Signboard Flicker: Primary neon headings can use subtle irregular flicker to mimic aging street signage.
- Bleeding Glows: Hover state should expand pink/cyan/orange glow layers simultaneously so light bleeds at the edges.
- Damp Atmosphere: Transitions stay smooth (duration-300 to 500) to preserve wet-night ambience rather than sharp arcade motion.
Example prompts
Ready-made page requests in this style.
Night Restaurant Menu
Create a late-night restaurant menu using Neon Tokyo style:
- Dark background with neon sign decorations
- Menu items with warm orange and pink neon accents
- Category tabs with multi-color neon borders
- Hero section with flickering neon sign effect
- Wet street reflection aesthetic at the bottom
- Japanese text decorations for atmosphere
SaaS Landing Page
Create a SaaS landing page using Neon Tokyo style with hero section, feature grid, testimonials, pricing table, and footer.
Portfolio Showcase
Create a portfolio showcase page using Neon Tokyo style with project grid, about section, contact form, and consistent visual language.
Use it in an app
Create a free account to attach this style to a project: the hub adds it to the prompt your AI assistant gets, so it builds every page in this look.

From StyleKit (MIT, commit 0156849).View source