The Retro Cosmic Arcade component library is a collection of eight purpose-built UI components that deliver a cohesive Y2K / early-internet aesthetic. Every component draws from the same Tailwind design token palette (Documentation Index
Fetch the complete documentation index at: https://mintlify.com/apursley2012/retro-cosmic-arcade/llms.txt
Use this file to discover all available pages before exploring further.
y2k-cyan, y2k-magenta, y2k-lime, y2k-panel, and friends) and is written as a standard React functional component. Several components are powered by Framer Motion for physics-aware animations and gesture support.
This page gives you a bird’s-eye view of every component and links you to its dedicated reference page.
Component groups
ChromeButton
Windows 98-style beveled button with Framer Motion scale animations on hover and tap.
CursorTrail
Fixed neon particle trail that follows the mouse cursor across the entire viewport.
Polaroid
Draggable retro project card with tilt, badge, and scanline overlay.
HitCounter
LCD segmented visitor counter display — wire it to any analytics endpoint.
MarqueeTicker
CSS-animated scrolling announcement banner in VT323 font with neon lime text.
PixelHPBar
Pixel-art 20-segment progress/skill bar styled after classic RPG HP bars.
WebringNav
React Router 6 navigation bar styled as a retro webring with PREV/NEXT/RANDOM links.
Footer
Site-wide footer component with copyright, socials, and Y2K panel styling.
Shared dependencies
Framer Motion is a shared peer dependency used by
ChromeButton, CursorTrail, and Polaroid. Make sure it is installed before using any of these three components.Font requirements
The library relies on three typefaces that must be loaded (typically via@font-face or Google Fonts):
| Tailwind class | Font name | Usage |
|---|---|---|
font-silkscreen | Silkscreen | Buttons, card titles, navigation labels |
font-vt323 | VT323 | Counters, HP bars, marquee text, labels |
font-inter | Inter | Body / description text inside Polaroid |