retro-css-architecture
Retro CSS Architecture
Organize CSS for 8-bit components using custom properties, pixel fonts, and responsive patterns.
Required Import
All 8-bit components must import the retro stylesheet:
import "@/components/ui/8bit/styles/retro.css";
Pixel Font
Use "Press Start 2P" for authentic 8-bit typography:
More from theorcdev/8bitcn-ui
fumadocs-mdx-structure
Create MDX documentation files with proper frontmatter, imports, and component integration. Apply when creating or updating Fumadocs documentation pages in content/docs/.
161rendering-animate-svg
Wrap animated SVG elements in a div to enable hardware acceleration. Apply when animating SVG icons or elements, especially in 8-bit retro components with pixel art animations.
928-bit-pixel-art-patterns
Create pixelated borders, shadows, and effects for 8-bit retro components. Apply when building 8-bit styled UI components that need authentic pixel art aesthetics.
86fumadocs-component-docs
Create component documentation with installation, usage examples, and preview sections. Apply when documenting 8-bit components with proper structure and examples.
85fumadocs-registry-integration
Register 8-bit components in registry.json for shadcn/ui add command. Apply when adding new components to the component library distribution.
60gaming-ui-state-management
Patterns for game-like interfaces - health bars, XP bars, mana bars. Apply when building RPG/retro gaming UI components with state-driven visuals.
45