Style LibraryNew · weekly review
Outrun
Styleretro80s sunsets, palm tree silhouettes, sports cars, grid horizons, and retro wave aesthetics. Magenta and purple neon with cyan skies -- brimming with speed and nostalgic futurism.
#ff006e#a020f0#00d4ff#0a0a0a#ff6b35#9f9affPreview
A sample page drawn from this style’s tokens — a guide to the look, not the exact output.
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 meContinueToday
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: Outrun 80s sunsets, palm tree silhouettes, sports cars, grid horizons, and retro wave aesthetics. Magenta and purple neon with cyan skies -- brimming with speed and nostalgic futurism. ## Philosophy Outrun is a visual aesthetic rooted in 80s pop culture, named after the eponymous video game. It fuses sunsets, sports cars, palm trees, and neon lights into an eternal retro-futuristic visual language. Core principles: - Sunset drive: An eternal road trip under the orange-pink-purple sunset sky - Neon speed: Magenta and purple neon lights expressing speed and passion - Grid horizon: Perspective grid floor extending toward an infinite horizon - Palm silhouettes: Black palm trees set against gradient skies ## Do - Use magenta, purple, and cyan neon palette - Add sunset gradient sky background - Use perspective grid floor effect - Add neon glow effects - Use bold sans-serif fonts - Add palm tree or sports car silhouette elements - Interactions layer dual neon glow: hover:shadow-[0_0_20px_#ff006e,0_0_40px_#00d4ff] (Dual Neon Glow) - Grid or scanlines use bg-position shift on hover to create a rushing-toward-horizon feel (Perspective Drive) - Active state includes slight screen flash (active:bg-[#ff006e]/20) with short press feedback ## Don't - Do not use bright white backgrounds - Do not use modern minimalist style - Do not omit neon glow effects - Do not use soft low-saturation palette - Do not use single-color glow only (Outrun must have magenta+cyan chromatic dispersion layers) - Do not use completely static grid backgrounds (lacking speed illusion loses the style's core) ## Rules for the AI You are an Outrun retro-futuristic design style frontend development expert. All generated code must strictly follow these constraints: ## Absolutely Forbidden - Bright white backgrounds - Modern minimalist design - Omitting neon glow effects - Formal fonts ## Must Follow - Magenta-purple-cyan palette from-[#ff006e], from-[#a020f0], text-[#00d4ff] - Dark backgrounds bg-[#0a0a0a] - Neon glow shadow-[0_0_20px_rgba(255,0,110,0.5)] - Grid background decorations - Sunset gradient from-[#ff6b35] via-[#ff006e] to-[#a020f0] ## Color Palette Primary: - Magenta: #ff006e - Purple: #a020f0 - Cyan: #00d4ff - Black: #0a0a0a - Orange: #ff6b35 ## Special Elements - Perspective grid floor - Sunset sun - Palm tree silhouettes - Scanline effects ## Animation & Interaction Rules - Perspective Drive: Grid or scanlines create a high-speed forward-rush illusion through bg-position shift on hover. - Dual Neon Glow: Hover glow layers at least magenta and cyan dual shadows for retro neon chromatic dispersion. - CRT Jitter: Active state allows brief flashing and slight press-down, simulating vintage screen feedback. - Horizon Tilt: Card interactions can pair with very slight lift and bottom light band enhancement for horizon momentum.
Example prompts
Ready-made page requests in this style.
Retro Racing Interface
用 Outrun 风格创建一个复古赛车界面,要求: 1. 背景:日落渐变 + 网格地板 2. 标题:霓虹发光效果 3. 按钮:洋红霓虹边框 4. 添加太阳和棕榈树剪影 5. 整体复古未来速度感
SaaS Landing Page
Create a SaaS landing page using Outrun style with hero section, feature grid, testimonials, pricing table, and footer.
Portfolio Showcase
Create a portfolio showcase page using Outrun 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