# AI Design Catalog

> Interface references for AI builds — a library of curated designs. Every reference ships
> a machine-readable design guide (`ai-guide.md`) and — where available — a
> self-contained reference implementation (`reference.html`) in the same folder.
> To reproduce a design, fetch the reference page's `ai-guide.md`, read the tokens and
> rules, study the preview/fullscreen source, and rebuild it in the target stack.

> URL note: paths below are relative to this file so the site works on any domain.

## References

- [AI Chat](refs/ai-chat/): Mobile Apps · Everyday Utilities. Self-contained reference.html included. Guide: [ai-guide.md](refs/ai-chat/ai-guide.md).
- [Album review](refs/album-review/): Articles & Editorial · Specialized Formats. Preview image: preview.png. Guide: [ai-guide.md](refs/album-review/ai-guide.md).
- [Announcement post](refs/announcement-post/): Social Media · Text Platforms. Preview image: preview.png. Guide: [ai-guide.md](refs/announcement-post/ai-guide.md).
- [App detail](refs/app-detail/): Profiles & Products · Listing Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/app-detail/ai-guide.md).
- [Art & prints](refs/art-and-prints/): Grids & Marketplace · Catalogs & Boards. Preview image: preview.png. Guide: [ai-guide.md](refs/art-and-prints/ai-guide.md).
- [Athlete stats](refs/athlete-stats/): Profiles & Products · Profile Pages. Preview image: preview.png. Guide: [ai-guide.md](refs/athlete-stats/ai-guide.md).
- [B2B restock cart](refs/b2b-restock-cart/): Grids & Marketplace · Cart Variations. Preview image: preview.png. Guide: [ai-guide.md](refs/b2b-restock-cart/ai-guide.md).
- [Banking](refs/banking/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/banking/ai-guide.md).
- [Bauhaus Geometric](refs/bauhaus-geometric/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/bauhaus-geometric/ai-guide.md).
- [Behind-the-scenes story](refs/bts-story/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/bts-story/ai-guide.md).
- [Bilingual / Accessibility-first](refs/bilingual-accessibility-first/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/bilingual-accessibility-first/ai-guide.md).
- [Boarding Pass](refs/boarding-pass/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/boarding-pass/ai-guide.md).
- [Bold display (light)](refs/bold-display-light/): Software Agency · More Home Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/bold-display-light/ai-guide.md).
- [Botanical landing](refs/botanical-landing/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/botanical-landing/ai-guide.md).
- [Brutalist Mono](refs/brutalist-mono/): Landing · Hero / Landing. Self-contained reference.html included. Guide: [ai-guide.md](refs/brutalist-mono/ai-guide.md).
- [Brutalist records](refs/brutalist-records/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/brutalist-records/ai-guide.md).
- [Budget drilldown (dark)](refs/budget-drilldown-dark/): Civic & Public Service · Records & Data. Preview image: preview.png. Guide: [ai-guide.md](refs/budget-drilldown-dark/ai-guide.md).
- [Calendar](refs/calendar/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/calendar/ai-guide.md).
- [Camera](refs/camera/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/camera/ai-guide.md).
- [Capability matrix (light)](refs/capability-matrix-light/): Software Agency · Services & Process. Preview image: preview.png. Guide: [ai-guide.md](refs/capability-matrix-light/ai-guide.md).
- [Careers (dark)](refs/careers-dark/): Software Agency · Journal & Culture. Preview image: preview.png. Guide: [ai-guide.md](refs/careers-dark/ai-guide.md).
- [Carousel cover](refs/carousel-cover/): Social Media · Instagram Posts. Preview image: preview.png. Guide: [ai-guide.md](refs/carousel-cover/ai-guide.md).
- [Carousel stat](refs/carousel-stat/): Social Media · Instagram Posts. Preview image: preview.png. Guide: [ai-guide.md](refs/carousel-stat/ai-guide.md).
- [Cart · full page](refs/cart-full-page/): Grids & Marketplace · Cart Variations. Preview image: preview.png. Guide: [ai-guide.md](refs/cart-full-page/ai-guide.md).
- [Cart · slide drawer](refs/cart-slide-drawer/): Grids & Marketplace · Cart Variations. Preview image: preview.png. Guide: [ai-guide.md](refs/cart-slide-drawer/ai-guide.md).
- [Case grid (light)](refs/case-grid-light/): Software Agency · Work & Case Study. Preview image: preview.png. Guide: [ai-guide.md](refs/case-grid-light/ai-guide.md).
- [Cash calendar](refs/cash-calendar/): Financial Apps · Everyday Money. Preview image: preview.png. Guide: [ai-guide.md](refs/cash-calendar/ai-guide.md).
- [Centsible · Envelope Budget](refs/centsible-envelope-budget/): Financial Apps · Everyday Money. Self-contained reference.html included. Guide: [ai-guide.md](refs/centsible-envelope-budget/ai-guide.md).
- [Citizen 311 (friendly)](refs/citizen-311-friendly/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/citizen-311-friendly/ai-guide.md).
- [Cobalt cultural](refs/cobalt-cultural/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/cobalt-cultural/ai-guide.md).
- [Comment thread](refs/comment-thread/): Social Media · Text Platforms. Preview image: preview.png. Guide: [ai-guide.md](refs/comment-thread/ai-guide.md).
- [Crypto Wallet](refs/crypto-wallet/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/crypto-wallet/ai-guide.md).
- [Customer account](refs/customer-account/): Profiles & Products · Profile Pages. Preview image: preview.png. Guide: [ai-guide.md](refs/customer-account/ai-guide.md).
- [Cyberpunk Neon](refs/cyberpunk-neon/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/cyberpunk-neon/ai-guide.md).
- [Dark Terminal](refs/dark-terminal/): Landing · Hero / Landing. Self-contained reference.html included. Guide: [ai-guide.md](refs/dark-terminal/ai-guide.md).
- [Data Atlas](refs/data-atlas/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/data-atlas/ai-guide.md).
- [Dataset record](refs/dataset-record/): Civic & Public Service · Records & Data. Preview image: preview.png. Guide: [ai-guide.md](refs/dataset-record/ai-guide.md).
- [Dating](refs/dating/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/dating/ai-guide.md).
- [Debt payoff planner](refs/debt-payoff/): Financial Apps · Planning & Payoff. Preview image: preview.png. Guide: [ai-guide.md](refs/debt-payoff/ai-guide.md).
- [Deep Forest](refs/deep-forest/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/deep-forest/ai-guide.md).
- [Deep Teal / Fintech](refs/deep-teal-fintech/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/deep-teal-fintech/ai-guide.md).
- [Design × engineering](refs/design-engineering/): Software Agency · More Home Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/design-engineering/ai-guide.md).
- [Designer portfolio](refs/designer-portfolio/): Profiles & Products · Profile Pages. Preview image: preview.png. Guide: [ai-guide.md](refs/designer-portfolio/ai-guide.md).
- [Dev blog](refs/dev-blog/): Articles & Editorial · Specialized Formats. Preview image: preview.png. Guide: [ai-guide.md](refs/dev-blog/ai-guide.md).
- [DevOps Status Wall](refs/devops-status-wall/): Landing · Dashboards. Preview image: preview.png. Guide: [ai-guide.md](refs/devops-status-wall/ai-guide.md).
- [Display / Anti-design](refs/display-anti-design/): Landing · Hero / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/display-anti-design/ai-guide.md).
- [District / Map-forward](refs/district-map-forward/): Civic & Public Service · Service Landings. Self-contained reference.html included. Guide: [ai-guide.md](refs/district-map-forward/ai-guide.md).
- [Docs article](refs/docs-article/): Articles & Editorial · Specialized Formats. Preview image: preview.png. Guide: [ai-guide.md](refs/docs-article/ai-guide.md).
- [Editorial case study (light)](refs/editorial-case-study-light/): Software Agency · Work & Case Study. Preview image: preview.png. Guide: [ai-guide.md](refs/editorial-case-study-light/ai-guide.md).
- [Editorial quote](refs/editorial-quote/): Social Media · Instagram Posts. Preview image: preview.png. Guide: [ai-guide.md](refs/editorial-quote/ai-guide.md).
- [Editorial Serif](refs/editorial-serif/): Landing · Hero / Landing. Self-contained reference.html included. Guide: [ai-guide.md](refs/editorial-serif/ai-guide.md).
- [Engagement cards (light)](refs/engagement-cards-light/): Software Agency · Studio. Preview image: preview.png. Guide: [ai-guide.md](refs/engagement-cards-light/ai-guide.md).
- [Engagement ledger (dark)](refs/engagement-ledger-dark/): Software Agency · Studio. Preview image: preview.png. Guide: [ai-guide.md](refs/engagement-ledger-dark/ai-guide.md).
- [Essay reader](refs/essay-reader/): Articles & Editorial · Long-form Reading. Preview image: preview.png. Guide: [ai-guide.md](refs/essay-reader/ai-guide.md).
- [Ethical investing portfolio](refs/ethical-portfolio/): Financial Apps · Work & Wealth. Preview image: preview.png. Guide: [ai-guide.md](refs/ethical-portfolio/ai-guide.md).
- [Event poster](refs/event-poster/): Social Media · Instagram Posts. Preview image: preview.png. Guide: [ai-guide.md](refs/event-poster/ai-guide.md).
- [Fashion (editorial)](refs/fashion-editorial/): Grids & Marketplace · Marketplace & Listings. Preview image: preview.png. Guide: [ai-guide.md](refs/fashion-editorial/ai-guide.md).
- [Fashion product page](refs/fashion-product-page/): Profiles & Products · Product Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/fashion-product-page/ai-guide.md).
- [Food Delivery](refs/food-delivery/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/food-delivery/ai-guide.md).
- [Food delivery grid](refs/food-delivery-grid/): Grids & Marketplace · Catalogs & Boards. Preview image: preview.png. Guide: [ai-guide.md](refs/food-delivery-grid/ai-guide.md).
- [Freelancer tax vault](refs/freelancer-tax/): Financial Apps · Work & Wealth. Preview image: preview.png. Guide: [ai-guide.md](refs/freelancer-tax/ai-guide.md).
- [Furniture catalog](refs/furniture-catalog/): Grids & Marketplace · Catalogs & Boards. Preview image: preview.png. Guide: [ai-guide.md](refs/furniture-catalog/ai-guide.md).
- [Furniture product page](refs/furniture-product-page/): Profiles & Products · Product Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/furniture-product-page/ai-guide.md).
- [Goal planner](refs/goal-planner/): Financial Apps · Planning & Payoff. Preview image: preview.png. Guide: [ai-guide.md](refs/goal-planner/ai-guide.md).
- [Guild community](refs/guild-community/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/guild-community/ai-guide.md).
- [Hand-sketched](refs/hand-sketched/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/hand-sketched/ai-guide.md).
- [Health Rings](refs/health-rings/): Landing · Dashboards. Preview image: preview.png. Guide: [ai-guide.md](refs/health-rings/ai-guide.md).
- [Hot Magenta](refs/hot-magenta/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/hot-magenta/ai-guide.md).
- [Household finance](refs/household-finance/): Financial Apps · Everyday Money. Preview image: preview.png. Guide: [ai-guide.md](refs/household-finance/ai-guide.md).
- [Index (Swiss)](refs/index-swiss/): Software Agency · Home / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/index-swiss/ai-guide.md).
- [Interview Q&A](refs/interview-qa/): Articles & Editorial · Long-form Reading. Preview image: preview.png. Guide: [ai-guide.md](refs/interview-qa/ai-guide.md).
- [Job board](refs/job-board/): Grids & Marketplace · Catalogs & Boards. Preview image: preview.png. Guide: [ai-guide.md](refs/job-board/ai-guide.md).
- [Journal article](refs/journal-article/): Software Agency · Journal & Culture. Preview image: preview.png. Guide: [ai-guide.md](refs/journal-article/ai-guide.md).
- [Journal index](refs/journal-index/): Software Agency · Journal & Culture. Preview image: preview.png. Guide: [ai-guide.md](refs/journal-index/ai-guide.md).
- [Kanban CRM](refs/kanban-crm/): Landing · Dashboards. Preview image: preview.png. Guide: [ai-guide.md](refs/kanban-crm/ai-guide.md).
- [Lavender wellness](refs/lavender-wellness/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/lavender-wellness/ai-guide.md).
- [Ledger (dark)](refs/ledger-dark/): Software Agency · Work & Case Study. Preview image: preview.png. Guide: [ai-guide.md](refs/ledger-dark/ai-guide.md).
- [Lifestyle reel](refs/lifestyle-reel/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/lifestyle-reel/ai-guide.md).
- [Lime sport](refs/lime-sport/): Landing · Saturated Color. Preview image: preview.png. Guide: [ai-guide.md](refs/lime-sport/ai-guide.md).
- [Link card post](refs/link-card-post/): Social Media · Text Platforms. Preview image: preview.png. Guide: [ai-guide.md](refs/link-card-post/ai-guide.md).
- [Live fitness](refs/live-fitness/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/live-fitness/ai-guide.md).
- [Magazine feature](refs/magazine-feature/): Articles & Editorial · Long-form Reading. Preview image: preview.png. Guide: [ai-guide.md](refs/magazine-feature/ai-guide.md).
- [Manifesto (dark)](refs/manifesto-dark/): Software Agency · Studio. Preview image: preview.png. Guide: [ai-guide.md](refs/manifesto-dark/ai-guide.md).
- [Maps navigation](refs/maps-navigation/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/maps-navigation/ai-guide.md).
- [Marketplace (resale)](refs/marketplace-resale/): Grids & Marketplace · Marketplace & Listings. Preview image: preview.png. Guide: [ai-guide.md](refs/marketplace-resale/ai-guide.md).
- [Meditation](refs/meditation/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/meditation/ai-guide.md).
- [Moodboard pin](refs/moodboard-pin/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/moodboard-pin/ai-guide.md).
- [Music creator profile](refs/music-creator-profile/): Profiles & Products · Profile Pages. Preview image: preview.png. Guide: [ai-guide.md](refs/music-creator-profile/ai-guide.md).
- [Music Player](refs/music-player/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/music-player/ai-guide.md).
- [Music share card](refs/music-share-card/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/music-share-card/ai-guide.md).
- [News broadsheet](refs/news-broadsheet/): Articles & Editorial · Editorial Indexes. Preview image: preview.png. Guide: [ai-guide.md](refs/news-broadsheet/ai-guide.md).
- [Newsletter index](refs/newsletter-index/): Articles & Editorial · Editorial Indexes. Preview image: preview.png. Guide: [ai-guide.md](refs/newsletter-index/ai-guide.md).
- [Newspaper Broadsheet](refs/newspaper-broadsheet/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/newspaper-broadsheet/ai-guide.md).
- [Night spec (dark)](refs/night-spec-dark/): Software Agency · Home / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/night-spec-dark/ai-guide.md).
- [Numbered services (dark)](refs/numbered-services-dark/): Software Agency · Services & Process. Preview image: preview.png. Guide: [ai-guide.md](refs/numbered-services-dark/ai-guide.md).
- [Photo essay](refs/photo-essay/): Articles & Editorial · Long-form Reading. Preview image: preview.png. Guide: [ai-guide.md](refs/photo-essay/ai-guide.md).
- [Photo Journal](refs/photo-journal/): Mobile Apps · Core Apps. Preview image: preview.png. Guide: [ai-guide.md](refs/photo-journal/ai-guide.md).
- [Plain Service Modern](refs/plain-service-modern/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/plain-service-modern/ai-guide.md).
- [Podcast](refs/podcast/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/podcast/ai-guide.md).
- [Podcast episode](refs/podcast-episode/): Articles & Editorial · Specialized Formats. Preview image: preview.png. Guide: [ai-guide.md](refs/podcast-episode/ai-guide.md).
- [Premium Dark Glass](refs/premium-dark-glass/): Landing · Hero / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/premium-dark-glass/ai-guide.md).
- [Print product page](refs/print-product-page/): Profiles & Products · Product Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/print-product-page/ai-guide.md).
- [Process map](refs/process-map/): Software Agency · Services & Process. Preview image: preview.png. Guide: [ai-guide.md](refs/process-map/ai-guide.md).
- [Product launch](refs/product-launch/): Social Media · Instagram Posts. Preview image: preview.png. Guide: [ai-guide.md](refs/product-launch/ai-guide.md).
- [Proof wall](refs/proof-wall/): Software Agency · Journal & Culture. Preview image: preview.png. Guide: [ai-guide.md](refs/proof-wall/ai-guide.md).
- [Property detail](refs/property-detail/): Profiles & Products · Listing Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/property-detail/ai-guide.md).
- [Public hearing agenda](refs/public-hearing-agenda/): Civic & Public Service · Records & Data. Preview image: preview.png. Guide: [ai-guide.md](refs/public-hearing-agenda/ai-guide.md).
- [Public ledger (dark)](refs/public-ledger-dark/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/public-ledger-dark/ai-guide.md).
- [Public records](refs/public-records/): Civic & Public Service · Service Landings. Preview image: preview.png. Guide: [ai-guide.md](refs/public-records/ai-guide.md).
- [Purchase coach](refs/purchase-coach/): Financial Apps · Planning & Payoff. Preview image: preview.png. Guide: [ai-guide.md](refs/purchase-coach/ai-guide.md).
- [Reaction video](refs/reaction-video/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/reaction-video/ai-guide.md).
- [Real estate (premium)](refs/real-estate-premium/): Grids & Marketplace · Marketplace & Listings. Preview image: preview.png. Guide: [ai-guide.md](refs/real-estate-premium/ai-guide.md).
- [Recipe page](refs/recipe-page/): Articles & Editorial · Specialized Formats. Preview image: preview.png. Guide: [ai-guide.md](refs/recipe-page/ai-guide.md).
- [Retirement planner](refs/retirement-planner/): Financial Apps · Planning & Payoff. Self-contained reference.html included. Guide: [ai-guide.md](refs/retirement-planner/ai-guide.md).
- [Riso zine](refs/riso-zine/): Articles & Editorial · Editorial Indexes. Preview image: preview.png. Guide: [ai-guide.md](refs/riso-zine/ai-guide.md).
- [Risograph](refs/risograph/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/risograph/ai-guide.md).
- [SaaS Analytics](refs/saas-analytics/): Landing · Dashboards. Self-contained reference.html included. Guide: [ai-guide.md](refs/saas-analytics/ai-guide.md).
- [Sale story](refs/sale-story/): Social Media · Stories & Reels. Preview image: preview.png. Guide: [ai-guide.md](refs/sale-story/ai-guide.md).
- [Service application](refs/service-application/): Civic & Public Service · Records & Data. Preview image: preview.png. Guide: [ai-guide.md](refs/service-application/ai-guide.md).
- [Sleep Tracker](refs/sleep-tracker/): Mobile Apps · Everyday Utilities. Preview image: preview.png. Guide: [ai-guide.md](refs/sleep-tracker/ai-guide.md).
- [Smart Home](refs/smart-home/): Landing · Dashboards. Preview image: preview.png. Guide: [ai-guide.md](refs/smart-home/ai-guide.md).
- [Social profile](refs/social-profile/): Profiles & Products · Profile Pages. Preview image: preview.png. Guide: [ai-guide.md](refs/social-profile/ai-guide.md).
- [Soft Pastel](refs/soft-pastel/): Landing · Hero / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/soft-pastel/ai-guide.md).
- [Spec sheet (dark)](refs/spec-sheet-dark/): Software Agency · Work & Case Study. Preview image: preview.png. Guide: [ai-guide.md](refs/spec-sheet-dark/ai-guide.md).
- [Split expenses](refs/split-expenses/): Financial Apps · Everyday Money. Preview image: preview.png. Guide: [ai-guide.md](refs/split-expenses/ai-guide.md).
- [Start a project](refs/start-a-project/): Software Agency · Studio. Preview image: preview.png. Guide: [ai-guide.md](refs/start-a-project/ai-guide.md).
- [Statement (light)](refs/statement-light/): Software Agency · Home / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/statement-light/ai-guide.md).
- [Stays grid](refs/stays-grid/): Grids & Marketplace · Marketplace & Listings. Preview image: preview.png. Guide: [ai-guide.md](refs/stays-grid/ai-guide.md).
- [Sticker Collage](refs/sticker-collage/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/sticker-collage/ai-guide.md).
- [Subscription garden](refs/subscription-garden/): Financial Apps · Work & Wealth. Preview image: preview.png. Guide: [ai-guide.md](refs/subscription-garden/ai-guide.md).
- [Swiss Modernist](refs/swiss-modernist/): Landing · Hero / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/swiss-modernist/ai-guide.md).
- [Team page (light)](refs/team-page-light/): Software Agency · Studio. Preview image: preview.png. Guide: [ai-guide.md](refs/team-page-light/ai-guide.md).
- [Tech product page](refs/tech-product-page/): Profiles & Products · Product Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/tech-product-page/ai-guide.md).
- [Text post](refs/text-post/): Social Media · Text Platforms. Preview image: preview.png. Guide: [ai-guide.md](refs/text-post/ai-guide.md).
- [Trading Terminal](refs/trading-terminal/): Landing · Dashboards. Self-contained reference.html included. Guide: [ai-guide.md](refs/trading-terminal/ai-guide.md).
- [Treasury dashboard](refs/treasury-dashboard/): Financial Apps · Work & Wealth. Preview image: preview.png. Guide: [ai-guide.md](refs/treasury-dashboard/ai-guide.md).
- [Vehicle detail](refs/vehicle-detail/): Profiles & Products · Listing Detail. Preview image: preview.png. Guide: [ai-guide.md](refs/vehicle-detail/ai-guide.md).
- [Vehicles (dark premium)](refs/vehicles-dark-premium/): Grids & Marketplace · Marketplace & Listings. Preview image: preview.png. Guide: [ai-guide.md](refs/vehicles-dark-premium/ai-guide.md).
- [Vibrant Pop](refs/vibrant-pop/): Landing · Hero / Landing. Preview image: preview.png. Guide: [ai-guide.md](refs/vibrant-pop/ai-guide.md).
- [Video thumbnail](refs/video-thumbnail/): Social Media · Text Platforms. Preview image: preview.png. Guide: [ai-guide.md](refs/video-thumbnail/ai-guide.md).
- [Weather](refs/weather/): Mobile Apps · Everyday Utilities. Self-contained reference.html included. Guide: [ai-guide.md](refs/weather/ai-guide.md).
- [Wine bar](refs/wine-bar/): Landing · Saturated Color. Self-contained reference.html included. Guide: [ai-guide.md](refs/wine-bar/ai-guide.md).
- [Y2K Chrome](refs/y2k-chrome/): Landing · More Directions. Preview image: preview.png. Guide: [ai-guide.md](refs/y2k-chrome/ai-guide.md).

## How to copy a design from a link

1. Fetch the reference's `ai-guide.md` (tokens, typography, layout, copy, do/don'ts).
2. Study the preview image / fullscreen source for the exact visual.
3. Reproduce the design in the target stack; verify against the guide's checklist.