Files
teamai-test/.teamai/skills/common/web-design-engineer/references/style-recipes/y2k-retrofuturism.md
T

55 lines
2.7 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# y2k-retrofuturism — Y2K / Frutiger Aero Retrofuturism
- **School**: Specialty / Genre
- **Vibe**: Late-90s / early-2000s techno-optimism: chrome, glassy bubbles, jelly translucency, lens flare
- **Best for**: Fashion / music / nostalgia-coded products, creative campaigns, anything referencing 1999–2005 internet
- **Touchstone**: late-90s Apple iMac G3 ads, Windows Vista Aero, the original iPod aqua buttons, MySpace pages
**Palette**
- Ground: electric ice blue `#A3D5FF` or chrome silver `#E0E4EA`
- Glass accents: cyan `#5FC9F8` → magenta `#FF66C4` (the iridescent / oil-slick gradient)
- Chrome: brushed-steel highlights at `#C4C9D2` to `#F2F4F8`
- Acid green pops: `#A8FF00` (used sparingly)
- Ink: `#000000` or `#FFFFFF` depending on ground
**Typography**
- Display: a chunky rounded sans with personality — Frutiger, Eurostile, or Sharp Grotesk in heavy weight; sometimes a chrome-effect treatment
- Body: friendly humanist sans like Frutiger or Avenir at 14–16px
- Numerals love an LCD / digital-readout treatment for hero counters
- Underline + sparkle treatments common on link hover
**Spacing**: 4 / 8 / 16 / 24 — packed but bubbly
**Radius**: gummy — 16 / 24 / 32 / 9999 (full circle). Buttons are pill-shaped jelly bubbles.
**Shadow**: heavy and colored — glossy reflections, drop shadows like `0 16px 32px rgba(95, 201, 248, 0.4)`. Inner highlights to simulate glass.
**Motion**: bouncy springs, glow pulses, lens flare sweeps. Anything that recalls early-Flash interactions.
**Signature moves**
- Glassy translucent buttons with an inner top highlight (faking aqua / lozenge)
- Iridescent oil-slick gradients on hero / character imagery
- Chrome-effect type with sparkle overlays
- Lens flare or specular highlight on any glass surface
- 3D / dimensional UI elements (the OS-X-Aqua dock effect)
- Floating circular orbs / bubbles drifting in the background
**Avoid**
- Sharp corners
- Muted / earthy palettes — Y2K is bright and synthetic
- Restrained typography — Y2K is exuberant
- Anything that reads as "tasteful 2020s minimalism"
**AI prompt seed**
> Y2K retrofuturism scene, chrome silver and ice-blue iridescent gradient background, floating glass orbs with cyan and magenta oil-slick reflections, lens flare in upper right, single bright translucent pill-shaped button, late-1990s techno-optimism vibe, 16:9.
**Don't use when**
- The brand has no nostalgic / retro / playful claim
- The audience is enterprise / professional — this recipe is consumer-fashion-music coded
- Long-form readability matters (Y2K is for moments, not for reading)
---
> **Same school — Specialty / Genre**: [`mid-century-modern`](./mid-century-modern.md)
> **Browse all 25 recipes**: [INDEX.md](./INDEX.md)