Layout
Composition principles
Use a full-viewport 16:10 composition with giant ghost typography behind a central figurine, smaller peripheral figures establishing depth, and anchored controls in the bottom corners.
U.S. Web Design System / Published Template
3D Collectible Hero
A full-viewport 3D collectible character carousel with bold ghost typography, color-shifting backgrounds, layered depth, grain texture, and tactile navigation.
Prompt reference v2Checking Prompt access...
Interaction
Behavior and access
Previous and next controls rotate four slides over 650ms; background color, scale, blur, opacity, and role positions animate together. Mobile uses tighter spacing and smaller peripheral figures.
Implementation
Engineering boundaries
React + TypeScript + Vite + Tailwind CSS with lucide-react icons. Preload all four images, use a 640px mobile breakpoint, and lock navigation while transitions are running.
Design system
U.S. Web Design System token ledger
The open design system for accessible and mobile-friendly United States government websites.
Color roles
- model
- accessible system tokens
- requiredRoles
- base, ink, primary, secondary, warning, error
Typography
- approach
- readable public-service scale
- requirements
- plain-language hierarchy, legible alerts
Spacing
- approach
- responsive public-service grid
- baseUnitPx
- 8
Component rules
- alerts
- State the service impact, affected area, and next action.
- accessibility
- Meet keyboard, contrast, and semantic structure requirements.
Classification
Where this template fits
Continue reading
Related templates
3D Story- Veldara
An immersive 3D world-building landing page for Veldara with layered scenes, product storytelling, and cinematic web motion.
3D Portfolio-3D
A dark 3D creator portfolio for Jack with immersive hero visuals, animated typography, selected work, services, and contact sections.
API Change Management Dashboard
A developer workspace for reviewing API versions, breaking changes, consumer impact, migration guidance, and rollout readiness.