AI DesignCatalog Interface references for AI builds

Reference designs your AI can actually copy

Send your agent a link.
Get the design.

AI Design Catalog is a small library of curated interface references. Every one ships an AI-ready brief, exact design tokens, and raw HTML at a predictable URL — so your coding agent can reproduce the design from a single link, in any stack.

Browse references See how it works →
143 curated references 143 ai-guide.md companion files 11 with copy-paste HTML previews + design tokens included

The AI-guide URL

How it works

one link in, one faithful design out

01

Open a reference

Every card links to a real page: the live design, the exact tokens, and copy-paste blocks for the AI-ready brief and the raw HTML.

02

Copy the URL or the brief

Hit Copy URL or Copy ready prompt. The URL points at a machine-readable ai-guide.md plus the reference.html implementation.

03

Paste it into your agent

Your coding agent fetches the guide, reads every token and the reference HTML, and rebuilds the design in your stack — React, React Native, Vue, plain HTML, anything.

The library

References

click a card → copy the AI-guide URL → paste into your agent

311 · 1,240 this week

Featured

District · Map-forward

A city-services landing that leads with a map. Big type, a single search field, and service tiles around a live map — find, pay, and track in one place.

Civic & Public Service map-forward warm paper
Copy page URL Open reference →
Left this month $2,146 SAFE TODAY · $86.40
Home$1,240 Fun$184
Groceries$318
Transport$96

Centsible · Envelope Budget

envelope-budget

A calm violet-and-cream envelope-budgeting home screen with a friendly “safe today” daily answer.

Financial Appssoft-pastelmobile Open reference →

Saas Analytics

saas-analytics

Deep-ink analytics dashboard: precise numerals, sparse charts, a lime pulse, and a table that stays readable.

SaaS · Dashboardsdark-terminalmono numerals Open reference →
The Quiet TimesNo. 214 · Summer
A slow map of the city’s loudest corner
A “The block is never quiet. It merely changes its tune.”

The Quiet Times · Editorial Serif

editorial-serif

A magazine feature in warm serif: masthead, drop cap, pull quote, and a two-column measure that begs to be read.

Editorialeditorial-seriflong-form Open reference →
Est. 2019 WE BUILD
UNBORING STUFF
PORTFOLIO — WORK — PROCESS — CONTACT — PORTFOLIO — WORK —

Brutalist Mono

brutalist-mono

Hard-edged agency landing in raw monospace: thick rules, offset shadows, one yellow block, zero apologies.

Agency · Landingbrutalist-monoloud Open reference → Acre · Growing Season — interface reference preview

Acre · Growing Season

acre-growing-season

Acre · Growing Season, a places & resources interface reference with an AI-ready brief and standalone HTML.

Dashboards Places & Resources Acreimported Open reference → AI Chat — interface reference preview

AI Chat

ai-chat

AI Chat, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities AI Chatmobile Open reference → AI Copilot Glow — interface reference preview

AI Copilot Glow

ai-copilot-glow

AI Copilot Glow, a more landings interface reference with an AI-ready brief and standalone HTML.

SaaS More Landings AI Copilot Glowimported Open reference → Album review — interface reference preview

Album review

album-review

Album review, a specialized formats interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Specialized Formats Album revieweditorial Open reference → Ampersand · Projector Flicker — interface reference preview

Ampersand · Projector Flicker

ampersand-projector-flicker

Ampersand · Projector Flicker, a place & craft interface reference with an AI-ready brief and standalone HTML.

Animation Place & Craft Ampersandimported Open reference → Announcement post — interface reference preview

Announcement post

announcement-post

Announcement post, a text platforms interface reference with an AI-ready brief and standalone HTML.

Social Media Text Platforms announcesocial Open reference → App detail — interface reference preview

App detail

app-detail

App detail, a listing detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Listing Detail App detailprofiles Open reference → Art & prints — interface reference preview

Art & prints

art-and-prints

Art & prints, a catalogs & boards interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Catalogs & Boards Art & printsmarket Open reference → Athlete stats — interface reference preview

Athlete stats

athlete-stats

Athlete stats, a profile pages interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Profile Pages Athleteprofiles Open reference → B2B restock cart — interface reference preview

B2B restock cart

b2b-restock-cart

B2B restock cart, a cart variations interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Cart Variations Cartmarket Open reference → Banking — interface reference preview

Banking

banking

Banking, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Bankingmobile Open reference → Bauhaus Geometric — interface reference preview

Bauhaus Geometric

bauhaus-geometric

Bauhaus Geometric, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Bauhaus Geometriclanding Open reference → Behind-the-scenes story — interface reference preview

Behind-the-scenes story

bts-story

Behind-the-scenes story, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Claude 4.7social Open reference → Bento Wall — interface reference preview

Bento Wall

bento-wall

Bento Wall, a landings interface reference with an AI-ready brief and standalone HTML.

SaaS Landings Bento Wallimported Open reference → Bilingual / Accessibility-first — interface reference preview

Bilingual / Accessibility-first

bilingual-accessibility-first

Bilingual / Accessibility-first, a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Bilingualcivic Open reference → Boarding Pass — interface reference preview

Boarding Pass

boarding-pass

Boarding Pass, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Boarding Passmobile Open reference → Bold display (light) — interface reference preview

Bold display (light)

bold-display-light

Bold display (light), a more home directions interface reference with an AI-ready brief and standalone HTML.

Software Agency More Home Directions Bold displayagency Open reference → Botanical landing — interface reference preview

Botanical landing

botanical-landing

Botanical landing, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Claude 4.7landing Open reference → Brutalist records — interface reference preview

Brutalist records

brutalist-records

Brutalist records, a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Claude 4.7civic Open reference → Budget drilldown (dark) — interface reference preview

Budget drilldown (dark)

budget-drilldown-dark

Budget drilldown (dark), a records & data interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Records & Data Budget drilldowncivic Open reference → Cairn · Contour Lines — interface reference preview

Cairn · Contour Lines

cairn-contour-lines

Cairn · Contour Lines, a ambient backdrops interface reference with an AI-ready brief and standalone HTML.

Animation Ambient Backdrops Cairnimported Open reference → Calendar — interface reference preview

Calendar

calendar

Calendar, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Calendarmobile Open reference → Camera — interface reference preview

Camera

camera

Camera, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Cameramobile Open reference → Capability matrix (light) — interface reference preview

Capability matrix (light)

capability-matrix-light

Capability matrix (light), a services & process interface reference with an AI-ready brief and standalone HTML.

Software Agency Services & Process Capability matrixagency Open reference → Careers (dark) — interface reference preview

Careers (dark)

careers-dark

Careers (dark), a journal & culture interface reference with an AI-ready brief and standalone HTML.

Software Agency Journal & Culture Careersagency Open reference → Carousel cover — interface reference preview

Carousel cover

carousel-cover

Carousel cover, a instagram posts interface reference with an AI-ready brief and standalone HTML.

Social Media Instagram Posts Carouselsocial Open reference → Carousel stat — interface reference preview

Carousel stat

carousel-stat

Carousel stat, a instagram posts interface reference with an AI-ready brief and standalone HTML.

Social Media Instagram Posts Carouselsocial Open reference → Cart · full page — interface reference preview

Cart · full page

cart-full-page

Cart · full page, a cart variations interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Cart Variations Cartmarket Open reference → Cart · slide drawer — interface reference preview

Cart · slide drawer

cart-slide-drawer

Cart · slide drawer, a cart variations interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Cart Variations Cartmarket Open reference → Case grid (light) — interface reference preview

Case grid (light)

case-grid-light

Case grid (light), a work & case study interface reference with an AI-ready brief and standalone HTML.

Software Agency Work & Case Study Case gridagency Open reference → Cash calendar — interface reference preview

Cash calendar

cash-calendar

Cash calendar, a everyday money interface reference with an AI-ready brief and standalone HTML.

Financial Apps Everyday Money Cash Calendarfinancial Open reference → Catchment · Attribution — interface reference preview

Catchment · Attribution

catchment-attribution

Catchment · Attribution, a platform dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Platform Dashboards Catchmentimported Open reference → Circuit · Grid Desk — interface reference preview

Circuit · Grid Desk

circuit-grid-desk

Circuit · Grid Desk, a places & resources interface reference with an AI-ready brief and standalone HTML.

Dashboards Places & Resources Circuitimported Open reference → Citizen 311 (friendly) — interface reference preview

Citizen 311 (friendly)

citizen-311-friendly

Citizen 311 (friendly), a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Citizen 311civic Open reference → Claimwell · Adjuster Desk — interface reference preview

Claimwell · Adjuster Desk

claimwell-adjuster-desk

Claimwell · Adjuster Desk, a knowledge & culture interface reference with an AI-ready brief and standalone HTML.

Dashboards Knowledge & Culture Claimwellimported Open reference → Cobalt cultural — interface reference preview

Cobalt cultural

cobalt-cultural

Cobalt cultural, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Cobaltlanding Open reference → Comment thread — interface reference preview

Comment thread

comment-thread

Comment thread, a text platforms interface reference with an AI-ready brief and standalone HTML.

Social Media Text Platforms Claude 4.7social Open reference → Concrete Poster — interface reference preview

Concrete Poster

concrete-poster

Concrete Poster, a brutalist systems interface reference with an AI-ready brief and standalone HTML.

Landing Brutalist Systems Concrete Posterlanding Open reference → Crypto Wallet — interface reference preview

Crypto Wallet

crypto-wallet

Crypto Wallet, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Crypto Walletmobile Open reference → Customer account — interface reference preview

Customer account

customer-account

Customer account, a profile pages interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Profile Pages Customer accountprofiles Open reference → Cut Room · Studio Pipeline — interface reference preview

Cut Room · Studio Pipeline

cut-room-studio-pipeline

Cut Room · Studio Pipeline, a knowledge & culture interface reference with an AI-ready brief and standalone HTML.

Dashboards Knowledge & Culture Cut Roomimported Open reference → Cyberpunk Neon — interface reference preview

Cyberpunk Neon

cyberpunk-neon

Cyberpunk Neon, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Cyberpunk Neonlanding Open reference → Dark Quiet — interface reference preview

Dark Quiet

dark-quiet

Dark Quiet, a minimalist studies interface reference with an AI-ready brief and standalone HTML.

Landing Minimalist Studies Dark Quietlanding Open reference → Dark Terminal — interface reference preview

Dark Terminal

dark-terminal

Dark Terminal, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Dark Terminallanding Open reference → Data Atlas — interface reference preview

Data Atlas

data-atlas

Data Atlas, a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Data Atlascivic Open reference → Data Manifesto — interface reference preview

Data Manifesto

data-manifesto

Data Manifesto, a brutalist systems interface reference with an AI-ready brief and standalone HTML.

Landing Brutalist Systems Data Manifestolanding Open reference → Dataset record — interface reference preview

Dataset record

dataset-record

Dataset record, a records & data interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Records & Data Dataset recordcivic Open reference → Dating — interface reference preview

Dating

dating

Dating, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Datingmobile Open reference → Debt payoff planner — interface reference preview

Debt payoff planner

debt-payoff

Debt payoff planner, a planning & payoff interface reference with an AI-ready brief and standalone HTML.

Financial Apps Planning & Payoff GPT 5.6 Solfinancial Open reference → Deep Forest — interface reference preview

Deep Forest

deep-forest

Deep Forest, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Deep Forestlanding Open reference → Deep Teal / Fintech — interface reference preview

Deep Teal / Fintech

deep-teal-fintech

Deep Teal / Fintech, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Deep Teallanding Open reference → Design × engineering — interface reference preview

Design × engineering

design-engineering

Design × engineering, a more home directions interface reference with an AI-ready brief and standalone HTML.

Software Agency More Home Directions design × engineeringagency Open reference → Designer portfolio — interface reference preview

Designer portfolio

designer-portfolio

Designer portfolio, a profile pages interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Profile Pages Designer portfolioprofiles Open reference → Deskline · Support Queue — interface reference preview

Deskline · Support Queue

deskline-support-queue

Deskline · Support Queue, a product dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Product Dashboards Desklineimported Open reference → Dev blog — interface reference preview

Dev blog

dev-blog

Dev blog, a specialized formats interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Specialized Formats Dev blogeditorial Open reference → DevOps Status Wall — interface reference preview

DevOps Status Wall

devops-status-wall

DevOps Status Wall, a dashboards interface reference with an AI-ready brief and standalone HTML.

Landing Dashboards DevOps Status Walllanding Open reference → Display / Anti-design — interface reference preview

Display / Anti-design

display-anti-design

Display / Anti-design, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Displaylanding Open reference → Docket · Matter Board — interface reference preview

Docket · Matter Board

docket-matter-board

Docket · Matter Board, a knowledge & culture interface reference with an AI-ready brief and standalone HTML.

Dashboards Knowledge & Culture Docketimported Open reference → Docs article — interface reference preview

Docs article

docs-article

Docs article, a specialized formats interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Specialized Formats Docs articleeditorial Open reference → Editorial case study (light) — interface reference preview

Editorial case study (light)

editorial-case-study-light

Editorial case study (light), a work & case study interface reference with an AI-ready brief and standalone HTML.

Software Agency Work & Case Study Caseagency Open reference → Editorial quote — interface reference preview

Editorial quote

editorial-quote

Editorial quote, a instagram posts interface reference with an AI-ready brief and standalone HTML.

Social Media Instagram Posts Editorial quotesocial Open reference → Engagement cards (light) — interface reference preview

Engagement cards (light)

engagement-cards-light

Engagement cards (light), a studio interface reference with an AI-ready brief and standalone HTML.

Software Agency Studio Engagementagency Open reference → Engagement ledger (dark) — interface reference preview

Engagement ledger (dark)

engagement-ledger-dark

Engagement ledger (dark), a studio interface reference with an AI-ready brief and standalone HTML.

Software Agency Studio Engagementagency Open reference → Enterprise Trust — interface reference preview

Enterprise Trust

enterprise-trust

Enterprise Trust, a more landings interface reference with an AI-ready brief and standalone HTML.

SaaS More Landings Enterprise Trustimported Open reference → Essay reader — interface reference preview

Essay reader

essay-reader

Essay reader, a long-form reading interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Long-form Reading Essay readereditorial Open reference → Ethical investing portfolio — interface reference preview

Ethical investing portfolio

ethical-portfolio

Ethical investing portfolio, a work & wealth interface reference with an AI-ready brief and standalone HTML.

Financial Apps Work & Wealth GPT 5.6 Solfinancial Open reference → Event poster — interface reference preview

Event poster

event-poster

Event poster, a instagram posts interface reference with an AI-ready brief and standalone HTML.

Social Media Instagram Posts Event postersocial Open reference → Fashion (editorial) — interface reference preview

Fashion (editorial)

fashion-editorial

Fashion (editorial), a marketplace & listings interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Marketplace & Listings Fashionmarket Open reference → Fashion product page — interface reference preview

Fashion product page

fashion-product-page

Fashion product page, a product detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Product Detail Claude 4.7profiles Open reference → Food Delivery — interface reference preview

Food Delivery

food-delivery

Food Delivery, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Food Deliverymobile Open reference → Food delivery grid — interface reference preview

Food delivery grid

food-delivery-grid

Food delivery grid, a catalogs & boards interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Catalogs & Boards Food delivery gridmarket Open reference → Freelancer tax vault — interface reference preview

Freelancer tax vault

freelancer-tax

Freelancer tax vault, a work & wealth interface reference with an AI-ready brief and standalone HTML.

Financial Apps Work & Wealth Taxfinancial Open reference → Furniture catalog — interface reference preview

Furniture catalog

furniture-catalog

Furniture catalog, a catalogs & boards interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Catalogs & Boards Furniture catalogmarket Open reference → Furniture product page — interface reference preview

Furniture product page

furniture-product-page

Furniture product page, a product detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Product Detail Claude 4.7profiles Open reference → Gate 14 · Airside Ops — interface reference preview

Gate 14 · Airside Ops

gate-14-airside-ops

Gate 14 · Airside Ops, a operations & infrastructure interface reference with an AI-ready brief and standalone HTML.

Dashboards Operations & Infrastructure Gate 14imported Open reference → Goal planner — interface reference preview

Goal planner

goal-planner

Goal planner, a planning & payoff interface reference with an AI-ready brief and standalone HTML.

Financial Apps Planning & Payoff Goal Plannerfinancial Open reference → Grand Serif Studio — interface reference preview

Grand Serif Studio

grand-serif-studio

Grand Serif Studio, a agency landings interface reference with an AI-ready brief and standalone HTML.

Landing Agency Landings Grand Serif Studiolanding Open reference → Guild community — interface reference preview

Guild community

guild-community

Guild community, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Guildlanding Open reference → Hand-sketched — interface reference preview

Hand-sketched

hand-sketched

Hand-sketched, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Handlanding Open reference → Harborline · Radar Sweep — interface reference preview

Harborline · Radar Sweep

harborline-radar-sweep

Harborline · Radar Sweep, a science & motion interface reference with an AI-ready brief and standalone HTML.

Animation Science & Motion Harborlineimported Open reference → Health Rings — interface reference preview

Health Rings

health-rings

Health Rings, a dashboards interface reference with an AI-ready brief and standalone HTML.

Landing Dashboards Health Ringslanding Open reference → Helix · DNA Spin — interface reference preview

Helix · DNA Spin

helix-dna-spin

Helix · DNA Spin, a science & motion interface reference with an AI-ready brief and standalone HTML.

Animation Science & Motion Heliximported Open reference → Hot Magenta — interface reference preview

Hot Magenta

hot-magenta

Hot Magenta, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Hot Magentalanding Open reference → House Ledger · Night Desk — interface reference preview

House Ledger · Night Desk

house-ledger-night-desk

House Ledger · Night Desk, a places & resources interface reference with an AI-ready brief and standalone HTML.

Dashboards Places & Resources House Ledgerimported Open reference → Household finance — interface reference preview

Household finance

household-finance

Household finance, a everyday money interface reference with an AI-ready brief and standalone HTML.

Financial Apps Everyday Money Householdfinancial Open reference → Index (Swiss) — interface reference preview

Index (Swiss)

index-swiss

Index (Swiss), a home / landing interface reference with an AI-ready brief and standalone HTML.

Software Agency Home / Landing Indexagency Open reference → Interview Q&A — interface reference preview

Interview Q&A

interview-qa

Interview Q&A, a long-form reading interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Long-form Reading Intervieweditorial Open reference → Job board — interface reference preview

Job board

job-board

Job board, a catalogs & boards interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Catalogs & Boards Job boardmarket Open reference → Journal article — interface reference preview

Journal article

journal-article

Journal article, a journal & culture interface reference with an AI-ready brief and standalone HTML.

Software Agency Journal & Culture Journalagency Open reference → Journal index — interface reference preview

Journal index

journal-index

Journal index, a journal & culture interface reference with an AI-ready brief and standalone HTML.

Software Agency Journal & Culture Journalagency Open reference → Kanban CRM — interface reference preview

Kanban CRM

kanban-crm

Kanban CRM, a dashboards interface reference with an AI-ready brief and standalone HTML.

Landing Dashboards Kanban CRMlanding Open reference → Kepler · Orbit — interface reference preview

Kepler · Orbit

kepler-orbit

Kepler · Orbit, a kinetic elements interface reference with an AI-ready brief and standalone HTML.

Animation Kinetic Elements Keplerimported Open reference → Keystone · Access Admin — interface reference preview

Keystone · Access Admin

keystone-access-admin

Keystone · Access Admin, a platform dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Platform Dashboards Keystoneimported Open reference → Kiln · Factory Floor — interface reference preview

Kiln · Factory Floor

kiln-factory-floor

Kiln · Factory Floor, a operations & infrastructure interface reference with an AI-ready brief and standalone HTML.

Dashboards Operations & Infrastructure Kilnimported Open reference → Klaxon · Incident Command — interface reference preview

Klaxon · Incident Command

klaxon-incident-command

Klaxon · Incident Command, a further dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Further Dashboards Klaxonimported Open reference → Lavender wellness — interface reference preview

Lavender wellness

lavender-wellness

Lavender wellness, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Lavenderlanding Open reference → Ledger (dark) — interface reference preview

Ledger (dark)

ledger-dark

Ledger (dark), a work & case study interface reference with an AI-ready brief and standalone HTML.

Software Agency Work & Case Study Ledgeragency Open reference → Ledger Consultancy — interface reference preview

Ledger Consultancy

ledger-consultancy

Ledger Consultancy, a agency landings interface reference with an AI-ready brief and standalone HTML.

Landing Agency Landings Ledger Consultancylanding Open reference → Lifestyle reel — interface reference preview

Lifestyle reel

lifestyle-reel

Lifestyle reel, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Lifestylesocial Open reference → Lime sport — interface reference preview

Lime sport

lime-sport

Lime sport, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Limelanding Open reference → Link card post — interface reference preview

Link card post

link-card-post

Link card post, a text platforms interface reference with an AI-ready brief and standalone HTML.

Social Media Text Platforms Claude 4.7social Open reference → Live fitness — interface reference preview

Live fitness

live-fitness

Live fitness, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Fitnessmobile Open reference → Lumen · Model Spend — interface reference preview

Lumen · Model Spend

lumen-model-spend

Lumen · Model Spend, a platform dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Platform Dashboards Lumenimported Open reference → Magazine feature — interface reference preview

Magazine feature

magazine-feature

Magazine feature, a long-form reading interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Long-form Reading Magazine featureeditorial Open reference → Manifesto (dark) — interface reference preview

Manifesto (dark)

manifesto-dark

Manifesto (dark), a studio interface reference with an AI-ready brief and standalone HTML.

Software Agency Studio Manifestoagency Open reference → Maps navigation — interface reference preview

Maps navigation

maps-navigation

Maps navigation, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Mapsmobile Open reference → Marketplace (resale) — interface reference preview

Marketplace (resale)

marketplace-resale

Marketplace (resale), a marketplace & listings interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Marketplace & Listings Marketplacemarket Open reference → Marquee Motion — interface reference preview

Marquee Motion

marquee-motion

Marquee Motion, a agency landings interface reference with an AI-ready brief and standalone HTML.

Landing Agency Landings Marquee Motionlanding Open reference → Meditation — interface reference preview

Meditation

meditation

Meditation, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Meditationmobile Open reference → Meridian · Hospital Command — interface reference preview

Meridian · Hospital Command

meridian-hospital-command

Meridian · Hospital Command, a operations & infrastructure interface reference with an AI-ready brief and standalone HTML.

Dashboards Operations & Infrastructure Meridianimported Open reference → Metered · Usage Billing — interface reference preview

Metered · Usage Billing

metered-usage-billing

Metered · Usage Billing, a product dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Product Dashboards Meteredimported Open reference → Moodboard pin — interface reference preview

Moodboard pin

moodboard-pin

Moodboard pin, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Claude 4.7social Open reference → Murmur · Lifecycle Journeys — interface reference preview

Murmur · Lifecycle Journeys

murmur-lifecycle-journeys

Murmur · Lifecycle Journeys, a further dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Further Dashboards Murmurimported Open reference → Museum Quiet — interface reference preview

Museum Quiet

museum-quiet

Museum Quiet, a minimalist studies interface reference with an AI-ready brief and standalone HTML.

Landing Minimalist Studies Museum Quietlanding Open reference → Music creator profile — interface reference preview

Music creator profile

music-creator-profile

Music creator profile, a profile pages interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Profile Pages Creatorprofiles Open reference → Music Player — interface reference preview

Music Player

music-player

Music Player, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Music Playermobile Open reference → Music share card — interface reference preview

Music share card

music-share-card

Music share card, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Claude 4.7social Open reference → Nectar · Steam Rise — interface reference preview

Nectar · Steam Rise

nectar-steam-rise

Nectar · Steam Rise, a place & craft interface reference with an AI-ready brief and standalone HTML.

Animation Place & Craft Nectarimported Open reference → News broadsheet — interface reference preview

News broadsheet

news-broadsheet

News broadsheet, a editorial indexes interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Editorial Indexes News broadsheeteditorial Open reference → Newsletter index — interface reference preview

Newsletter index

newsletter-index

Newsletter index, a editorial indexes interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Editorial Indexes Newsletter indexeditorial Open reference → Newspaper Broadsheet — interface reference preview

Newspaper Broadsheet

newspaper-broadsheet

Newspaper Broadsheet, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Newspaper Broadsheetlanding Open reference → Night spec (dark) — interface reference preview

Night spec (dark)

night-spec-dark

Night spec (dark), a home / landing interface reference with an AI-ready brief and standalone HTML.

Software Agency Home / Landing Specagency Open reference → Nock · Activation — interface reference preview

Nock · Activation

nock-activation

Nock · Activation, a product dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Product Dashboards Nockimported Open reference → Numbered services (dark) — interface reference preview

Numbered services (dark)

numbered-services-dark

Numbered services (dark), a services & process interface reference with an AI-ready brief and standalone HTML.

Software Agency Services & Process Numbered servicesagency Open reference → Object White — interface reference preview

Object White

object-white

Object White, a minimalist studies interface reference with an AI-ready brief and standalone HTML.

Landing Minimalist Studies Object Whitelanding Open reference → Pass · Service Floor — interface reference preview

Pass · Service Floor

pass-service-floor

Pass · Service Floor, a places & resources interface reference with an AI-ready brief and standalone HTML.

Dashboards Places & Resources Passimported Open reference → Perigee · Starfield — interface reference preview

Perigee · Starfield

perigee-starfield

Perigee · Starfield, a ambient backdrops interface reference with an AI-ready brief and standalone HTML.

Animation Ambient Backdrops Perigeeimported Open reference → Photo essay — interface reference preview

Photo essay

photo-essay

Photo essay, a long-form reading interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Long-form Reading Photo essayeditorial Open reference → Photo Journal — interface reference preview

Photo Journal

photo-journal

Photo Journal, a core apps interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Core Apps Photo Journalmobile Open reference → Plain Service Modern — interface reference preview

Plain Service Modern

plain-service-modern

Plain Service Modern, a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Plain Service Moderncivic Open reference → Plinth · Stacking Floors — interface reference preview

Plinth · Stacking Floors

plinth-stacking-floors

Plinth · Stacking Floors, a place & craft interface reference with an AI-ready brief and standalone HTML.

Animation Place & Craft Plinthimported Open reference → Podcast — interface reference preview

Podcast

podcast

Podcast, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Podcastmobile Open reference → Podcast episode — interface reference preview

Podcast episode

podcast-episode

Podcast episode, a specialized formats interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Specialized Formats Podcast episodeeditorial Open reference → Pop Polygon — interface reference preview

Pop Polygon

pop-polygon

Pop Polygon, a agency landings interface reference with an AI-ready brief and standalone HTML.

Landing Agency Landings Pop Polygonlanding Open reference → Premium Dark Glass — interface reference preview

Premium Dark Glass

premium-dark-glass

Premium Dark Glass, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Premium Dark Glasslanding Open reference → Print product page — interface reference preview

Print product page

print-product-page

Print product page, a product detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Product Detail Claude 4.7profiles Open reference → Process map — interface reference preview

Process map

process-map

Process map, a services & process interface reference with an AI-ready brief and standalone HTML.

Software Agency Services & Process Processagency Open reference → Product launch — interface reference preview

Product launch

product-launch

Product launch, a instagram posts interface reference with an AI-ready brief and standalone HTML.

Social Media Instagram Posts Product launchsocial Open reference → Proof wall — interface reference preview

Proof wall

proof-wall

Proof wall, a journal & culture interface reference with an AI-ready brief and standalone HTML.

Software Agency Journal & Culture Proof wallagency Open reference → Property detail — interface reference preview

Property detail

property-detail

Property detail, a listing detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Listing Detail Property detailprofiles Open reference → Public hearing agenda — interface reference preview

Public hearing agenda

public-hearing-agenda

Public hearing agenda, a records & data interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Records & Data Public hearing agendacivic Open reference → Public ledger (dark) — interface reference preview

Public ledger (dark)

public-ledger-dark

Public ledger (dark), a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Public Ledgercivic Open reference → Public records — interface reference preview

Public records

public-records

Public records, a service landings interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Service Landings Claude 4.7civic Open reference → Purchase coach — interface reference preview

Purchase coach

purchase-coach

Purchase coach, a planning & payoff interface reference with an AI-ready brief and standalone HTML.

Financial Apps Planning & Payoff Purchase Coachfinancial Open reference → Quorum · Account Health — interface reference preview

Quorum · Account Health

quorum-account-health

Quorum · Account Health, a product dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Product Dashboards Quorumimported Open reference → Raw Web Casual — interface reference preview

Raw Web Casual

raw-web-casual

Raw Web Casual, a brutalist systems interface reference with an AI-ready brief and standalone HTML.

Landing Brutalist Systems Raw Web Casuallanding Open reference → Reaction video — interface reference preview

Reaction video

reaction-video

Reaction video, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Reactionsocial Open reference → Real estate (premium) — interface reference preview

Real estate (premium)

real-estate-premium

Real estate (premium), a marketplace & listings interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Marketplace & Listings Real estatemarket Open reference → Recipe page — interface reference preview

Recipe page

recipe-page

Recipe page, a specialized formats interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Specialized Formats Recipeeditorial Open reference → Retirement planner — interface reference preview

Retirement planner

retirement-planner

Retirement planner, a planning & payoff interface reference with an AI-ready brief and standalone HTML.

Financial Apps Planning & Payoff Retirementfinancial Open reference → Ridge · Falling Snow — interface reference preview

Ridge · Falling Snow

ridge-falling-snow

Ridge · Falling Snow, a place & craft interface reference with an AI-ready brief and standalone HTML.

Animation Place & Craft Ridgeimported Open reference → Riso zine — interface reference preview

Riso zine

riso-zine

Riso zine, a editorial indexes interface reference with an AI-ready brief and standalone HTML.

Articles & Editorial Editorial Indexes Riso zineeditorial Open reference → Risograph — interface reference preview

Risograph

risograph

Risograph, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Risographlanding Open reference → Roster · People Ops — interface reference preview

Roster · People Ops

roster-people-ops

Roster · People Ops, a knowledge & culture interface reference with an AI-ready brief and standalone HTML.

Dashboards Knowledge & Culture Rosterimported Open reference → Rue Neuf · Marquee — interface reference preview

Rue Neuf · Marquee

rue-neuf-marquee

Rue Neuf · Marquee, a kinetic elements interface reference with an AI-ready brief and standalone HTML.

Animation Kinetic Elements Rue Neufimported Open reference → Sale story — interface reference preview

Sale story

sale-story

Sale story, a stories & reels interface reference with an AI-ready brief and standalone HTML.

Social Media Stories & Reels Salesocial Open reference → Service application — interface reference preview

Service application

service-application

Service application, a records & data interface reference with an AI-ready brief and standalone HTML.

Civic & Public Service Records & Data Service applicationcivic Open reference → Signup First — interface reference preview

Signup First

signup-first

Signup First, a landings interface reference with an AI-ready brief and standalone HTML.

SaaS Landings Signup Firstimported Open reference → Sleep Tracker — interface reference preview

Sleep Tracker

sleep-tracker

Sleep Tracker, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Sleep Trackermobile Open reference → Slipstream · Racing HUD — interface reference preview

Slipstream · Racing HUD

slipstream-racing-hud

Slipstream · Racing HUD, a science & motion interface reference with an AI-ready brief and standalone HTML.

Animation Science & Motion Slipstreamimported Open reference → Slipway · Pipeline Monitor — interface reference preview

Slipway · Pipeline Monitor

slipway-pipeline-monitor

Slipway · Pipeline Monitor, a further dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Further Dashboards Slipwayimported Open reference → Smart Home — interface reference preview

Smart Home

smart-home

Smart Home, a dashboards interface reference with an AI-ready brief and standalone HTML.

Landing Dashboards Smart Homelanding Open reference → Social profile — interface reference preview

Social profile

social-profile

Social profile, a profile pages interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Profile Pages Social profileprofiles Open reference → Social Proof Wall — interface reference preview

Social Proof Wall

social-proof-wall

Social Proof Wall, a more landings interface reference with an AI-ready brief and standalone HTML.

SaaS More Landings Social Proof Wallimported Open reference → Soft Cloud Gradient — interface reference preview

Soft Cloud Gradient

soft-cloud-gradient

Soft Cloud Gradient, a landings interface reference with an AI-ready brief and standalone HTML.

SaaS Landings Soft Cloud Gradientimported Open reference → Soft Pastel — interface reference preview

Soft Pastel

soft-pastel

Soft Pastel, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Soft Pastellanding Open reference → Solstice · Aurora Drift — interface reference preview

Solstice · Aurora Drift

solstice-aurora-drift

Solstice · Aurora Drift, a ambient backdrops interface reference with an AI-ready brief and standalone HTML.

Animation Ambient Backdrops Solsticeimported Open reference → Spec sheet (dark) — interface reference preview

Spec sheet (dark)

spec-sheet-dark

Spec sheet (dark), a work & case study interface reference with an AI-ready brief and standalone HTML.

Software Agency Work & Case Study Spec sheetagency Open reference → Split expenses — interface reference preview

Split expenses

split-expenses

Split expenses, a everyday money interface reference with an AI-ready brief and standalone HTML.

Financial Apps Everyday Money Split Expensesfinancial Open reference → Splitrun · Experiment Board — interface reference preview

Splitrun · Experiment Board

splitrun-experiment-board

Splitrun · Experiment Board, a more dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS More Dashboards Splitrunimported Open reference → Stageline · Onboarding Rollout — interface reference preview

Stageline · Onboarding Rollout

stageline-onboarding-rollout

Stageline · Onboarding Rollout, a more dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS More Dashboards Stagelineimported Open reference → Start a project — interface reference preview

Start a project

start-a-project

Start a project, a studio interface reference with an AI-ready brief and standalone HTML.

Software Agency Studio Start a projectagency Open reference → Statement (light) — interface reference preview

Statement (light)

statement-light

Statement (light), a home / landing interface reference with an AI-ready brief and standalone HTML.

Software Agency Home / Landing Statementagency Open reference → Stays grid — interface reference preview

Stays grid

stays-grid

Stays grid, a marketplace & listings interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Marketplace & Listings Stays gridmarket Open reference → Sticker Collage — interface reference preview

Sticker Collage

sticker-collage

Sticker Collage, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Sticker Collagelanding Open reference → Sticker Slap — interface reference preview

Sticker Slap

sticker-slap

Sticker Slap, a brutalist systems interface reference with an AI-ready brief and standalone HTML.

Landing Brutalist Systems Sticker Slaplanding Open reference → Subscription garden — interface reference preview

Subscription garden

subscription-garden

Subscription garden, a work & wealth interface reference with an AI-ready brief and standalone HTML.

Financial Apps Work & Wealth Subscription Gardenfinancial Open reference → Suture · Path Trace — interface reference preview

Suture · Path Trace

suture-path-trace

Suture · Path Trace, a science & motion interface reference with an AI-ready brief and standalone HTML.

Animation Science & Motion Sutureimported Open reference → Swiss Modernist — interface reference preview

Swiss Modernist

swiss-modernist

Swiss Modernist, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Swiss Modernistlanding Open reference → Tallyline · Revenue Desk — interface reference preview

Tallyline · Revenue Desk

tallyline-revenue-desk

Tallyline · Revenue Desk, a more dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS More Dashboards Tallylineimported Open reference → Team page (light) — interface reference preview

Team page (light)

team-page-light

Team page (light), a studio interface reference with an AI-ready brief and standalone HTML.

Software Agency Studio Teamagency Open reference → Tech product page — interface reference preview

Tech product page

tech-product-page

Tech product page, a product detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Product Detail Claude 4.7profiles Open reference → Terminal Dev Tool — interface reference preview

Terminal Dev Tool

terminal-dev-tool

Terminal Dev Tool, a landings interface reference with an AI-ready brief and standalone HTML.

SaaS Landings Terminal Dev Toolimported Open reference → Text post — interface reference preview

Text post

text-post

Text post, a text platforms interface reference with an AI-ready brief and standalone HTML.

Social Media Text Platforms text postsocial Open reference → Thresh · Trust Queue — interface reference preview

Thresh · Trust Queue

thresh-trust-queue

Thresh · Trust Queue, a platform dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Platform Dashboards Threshimported Open reference → Tollgate · API Console — interface reference preview

Tollgate · API Console

tollgate-api-console

Tollgate · API Console, a more dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS More Dashboards Tollgateimported Open reference → Trading Terminal — interface reference preview

Trading Terminal

trading-terminal

Trading Terminal, a dashboards interface reference with an AI-ready brief and standalone HTML.

Landing Dashboards Trading Terminallanding Open reference → Treasury dashboard — interface reference preview

Treasury dashboard

treasury-dashboard

Treasury dashboard, a work & wealth interface reference with an AI-ready brief and standalone HTML.

Financial Apps Work & Wealth Treasuryfinancial Open reference → Type Specimen — interface reference preview

Type Specimen

type-specimen

Type Specimen, a minimalist studies interface reference with an AI-ready brief and standalone HTML.

Landing Minimalist Studies Type Specimenlanding Open reference → Undertow · Waveform — interface reference preview

Undertow · Waveform

undertow-waveform

Undertow · Waveform, a ambient backdrops interface reference with an AI-ready brief and standalone HTML.

Animation Ambient Backdrops Undertowimported Open reference → Vehicle detail — interface reference preview

Vehicle detail

vehicle-detail

Vehicle detail, a listing detail interface reference with an AI-ready brief and standalone HTML.

Profiles & Products Listing Detail Vehicle detailprofiles Open reference → Vehicles (dark premium) — interface reference preview

Vehicles (dark premium)

vehicles-dark-premium

Vehicles (dark premium), a marketplace & listings interface reference with an AI-ready brief and standalone HTML.

Grids & Marketplace Marketplace & Listings Vehiclesmarket Open reference → Vellum · Kinetic Type — interface reference preview

Vellum · Kinetic Type

vellum-kinetic-type

Vellum · Kinetic Type, a kinetic elements interface reference with an AI-ready brief and standalone HTML.

Animation Kinetic Elements Vellumimported Open reference → Verbatim · Locale Coverage — interface reference preview

Verbatim · Locale Coverage

verbatim-locale-coverage

Verbatim · Locale Coverage, a further dashboards interface reference with an AI-ready brief and standalone HTML.

SaaS Further Dashboards Verbatimimported Open reference → Vertical Suite — interface reference preview

Vertical Suite

vertical-suite

Vertical Suite, a more landings interface reference with an AI-ready brief and standalone HTML.

SaaS More Landings Vertical Suiteimported Open reference → Vibrant Pop — interface reference preview

Vibrant Pop

vibrant-pop

Vibrant Pop, a hero / landing interface reference with an AI-ready brief and standalone HTML.

Landing Hero / Landing Vibrant Poplanding Open reference → Video thumbnail — interface reference preview

Video thumbnail

video-thumbnail

Video thumbnail, a text platforms interface reference with an AI-ready brief and standalone HTML.

Social Media Text Platforms Claude 4.7social Open reference → Voltlane · Glitch Neon — interface reference preview

Voltlane · Glitch Neon

voltlane-glitch-neon

Voltlane · Glitch Neon, a kinetic elements interface reference with an AI-ready brief and standalone HTML.

Animation Kinetic Elements Voltlaneimported Open reference → Weather — interface reference preview

Weather

weather

Weather, a everyday utilities interface reference with an AI-ready brief and standalone HTML.

Mobile Apps Everyday Utilities Weathermobile Open reference → Wine bar — interface reference preview

Wine bar

wine-bar

Wine bar, a saturated color interface reference with an AI-ready brief and standalone HTML.

Landing Saturated Color Wine barlanding Open reference → Y2K Chrome — interface reference preview

Y2K Chrome

y2k-chrome

Y2K Chrome, a more directions interface reference with an AI-ready brief and standalone HTML.

Landing More Directions Y2K Chromelanding Open reference → Yardline · Fleet Control — interface reference preview

Yardline · Fleet Control

yardline-fleet-control

Yardline · Fleet Control, a operations & infrastructure interface reference with an AI-ready brief and standalone HTML.

Dashboards Operations & Infrastructure Yardlineimported Open reference →
No references match that filter. Try another category or clear the search.

Built by a founder & AI engineer

Need a design like these — or a product built from one?

I curate this catalog and build AI-native apps at davidlopena.com: product design, landing pages, and full AI-native builds. Tell me what you're making.

Get in touch → Support on Ko-fi ↗