New: community Kit Gallery

Design-system kits for AI coding agents

Browse kits published from Layout Studio projects. One click and they land in your workspace ready to build with. Fully interoperable with Google's design.md.

Every kit doubles as an installable Layout UI theme: npx shadcn add https://layout.design/r/<slug>/theme.json

atlassian.com preview

atlassian.com

MIT

Enterprise design system for Atlassian's marketing site, featuring bold brand colours, custom typography, and structured spacing tokens built for large-scale SaaS platforms

Layout
06
boldsaaslanding-pagelight
github.com preview

github.com

MIT

GitHub's production design system with 568 CSS custom properties, featuring clean typography, accessible colour tokens, and motion primitives built for developer platforms and collaborative workflows

Layout
04
darkdeveloper-toolsaas
Customer.io preview

Customer.io

MIT

Dark SaaS design system with mint-green accents and clean typography, built for product dashboards and developer-focused platforms

Layout
011
darksaasdeveloper-tooldashboard
Asana preview

Asana

MIT

Enterprise work-management design system with sharp modernist aesthetic, dark-mode focus and purposeful colour accents for product teams

Layout
02
darksaasdashboarddeveloper-tool
Perplexity preview

Perplexity

MIT

Clean, accessible design system for a conversational AI search interface with light-first aesthetics, system fonts, and precise focus states

Layout
03
lightminimaldeveloper-toolsaas
Bonsai preview

Bonsai

MIT

Minimal, light design system with warm orange and indigo accents, built on CSS custom properties for SaaS and marketing sites

Layout
05
lightminimalsaaslanding-page
Intercom preview

Intercom

MIT

A modern SaaS design system with clean typography, precise spacing tokens, and a sophisticated blue–black palette built for product interfaces and customer communication platforms

Layout
02
saasdarkminimaldeveloper-tool
Folk preview

Folk

MIT

A modern, minimal design system with playful brand accents and pill-shaped buttons, built for SaaS and content-driven products that value clarity and personality

Layout
03
lightminimalsaascontent-first
Attio preview

Attio

MIT

Modern SaaS design system with a dark foundation, vibrant blue and cyan accents, and a soft brand palette suited for B2B product interfaces

Layout
04
darksaasdeveloper-tool
Dovetail preview

Dovetail

MIT

Bold, vibrant design system with electric blue surfaces and carefully restricted colour palette, built for React applications that demand modern, branded interfaces

Layout
06
boldlightdeveloper-toolsaas
Google preview

Google

MIT

Google's clean, accessible design system with bright blue accents, subtle surfaces, and precise spacing—ideal for SaaS products and web applications

Layout
06
lightminimalsaas
Figma preview

Figma

MIT

Clean, minimal design system for Figma's product and marketing surfaces, built on CSS variables and a modern sans-serif typeface for developer flexibility

Layout
08
lightminimalsaasdeveloper-tool
ClickUp preview

ClickUp

MIT

Modern task-management design system with vibrant gradient accents, pill-shaped buttons, and clean typography—built for productivity platforms and collaborative tools

Layout
032
saasdashboardboldlight
Salesforce preview

Salesforce

MIT

Enterprise SaaS design system with serif typography and minimal dark-on-light aesthetic, built for corporate software interfaces and dashboards

Layout
016
lightminimalsaasdashboard
Fey preview

Fey

MIT

A dark-first design system with custom typefaces and refined glassmorphic surfaces, built for sophisticated SaaS and fintech products

Layout
014
darksaasfintechminimal
Contra preview

Contra

MIT

Playful yet professional design system with teal and purple accents, bold typography, and vibrant accent surfaces—built for modern SaaS platforms and landing pages

Layout
022
lightboldsaaslanding-page
DoorDash preview

DoorDash

MIT

Clean, accessible food-delivery system with DoorDash's signature red accent, light neutral palette, and system-font typography—built for rapid product development

Layout
020
lightecommsaasmobile
Mercedes-Benz preview

Mercedes-Benz

MIT

Luxe, minimalist design system with sharp black-and-white contrast and serif typography, crafted for premium automotive and lifestyle brands

Layout
019
darkminimalboldecomm
Wise preview

Wise

MIT

Clean, accessible financial design system with lime-green accents and Swiss typography, built for fintech products that prioritise clarity and trust

Layout
018
lightfintechminimalsaas
Spotify preview

Spotify

MIT

Dark, minimal music streaming interface with Spotify's signature green accent and refined typography, ideal for audio platforms and content-heavy dashboards

Layout
037
darkminimaldashboardcontent-first
Nike preview

Nike

MIT

Bold, performance-focused design system built on Nike's Podium language with striking orange accents, geometric typography, and pill-shaped buttons for athletic brand applications

Layout
027
bolddarkecommlanding-page
Airbnb preview

Airbnb

MIT

Hospitality-focused design system with warm brand red, clean surfaces and accessible typography, built for global booking experiences

Layout
033
lightecommlanding-pagemobile
Mixpanel preview

Mixpanel

MIT

Modern analytics platform design system with deep purple and gold accents, frosted glass elements, and precise token-based spacing—built for data-driven SaaS products

Layout
031
darksaasdashboarddeveloper-tool
Clay preview

Clay

MIT

Clean, modern B2B design system with warm and cool accent colours, built on Roobertvf typography and CSS custom properties for seamless developer integration

Layout
043
lightminimalsaasdeveloper-tool
Xero preview

Xero

MIT

Clean, modern SaaS design system built on navy and mint green with sharp corners and purposeful typography for accounting and business software

Layout
049
saasfintechlightminimal
Netflix preview

Netflix

MIT

Dark, bold streaming platform design system with signature red accent and cinematic motion, built for large-scale video content discovery and subscription flows

Layout
032
darkboldecommlanding-page
Cash App preview

Cash App

MIT

Bold, high-contrast fintech design system built on Cash App's signature neon green and black palette, optimised for mobile payment interfaces and developer implementation

Layout
034
fintechmobilebolddark
Klarna preview

Klarna

MIT

Clean, modern fintech interface with Klarna's signature pink accents and dark eggplant typography, designed for seamless payment and shopping experiences

Layout
025
lightboldfintechecomm
IBM preview

IBM

MIT

Enterprise-grade design system with IBM's iconic blue accent, sophisticated typography hierarchy, and fluid spacing built on Carbon principles—ideal for corporate products and SaaS platforms

Layout
047
saasdeveloper-tooldashboardlight
Monzo preview

Monzo

MIT

Dark, modern fintech design system with navy foundations, coral accents, and fluid typography—built for fast-moving financial products and developer teams

Layout
060
darkfintechdeveloper-toolsaas
Dropbox preview

Dropbox

MIT

Clean, professional design system with warm neutrals and blue accents, built for Dropbox's web ecosystem and suited to SaaS and productivity platforms

Layout
058
lightminimalsaas
Zendesk preview

Zendesk

MIT

Modern SaaS design system with dark green and lime accents, built for customer support platforms and enterprise applications

Layout
024
darksaasminimal
Webflow preview

Webflow

MIT

Clean, professional design system for a SaaS marketing platform with Webflow's signature blue accent and neutral palette, built on CSS custom properties for seamless integration

Layout
033
lightsaaslanding-pagedeveloper-tool
Uber preview

Uber

MIT

Clean, light-themed design system with Uber's signature pill-button shapes and motion tokens, built for ride-sharing and mobility platforms

Layout
024
lightsaasmobiledashboard
Vercel preview

Vercel

MIT

Clean, minimal developer-focused design system built on Geist typography with light surfaces, precise spacing, and fast interactions for modern web applications

Layout
027
lightminimaldeveloper-toolsaas
Sentry preview

Sentry

MIT

Dark, minimal design system for developer tools with a sophisticated purple palette and refined typography, tailored for error monitoring and performance platforms

Layout
031
darkminimaldeveloper-toolsaas
OpenAI preview

OpenAI

MIT

Clean, minimal design system for AI-native products built on Next.js and Tailwind, featuring a light monochromatic palette with precise token-based spacing and typography

Layout
034
lightminimalsaasdeveloper-tool
Duolingo preview

Duolingo

MIT

Vibrant, playful design system with bright green accents and light blue surfaces, built for engaging educational and language-learning products

Layout
032
lightboldcontent-firstmobile
Coinbase preview

Coinbase

MIT

Clean, professional fintech design system with bright blue accents and minimal aesthetic, built for React/Next.js applications and financial platforms

Layout
032
lightminimalfintechsaas
WhatsApp preview

WhatsApp

MIT

Friendly, accessible messaging interface with bright green accents and warm neutrals, designed for global communication apps and messaging platforms

Layout
019
lightmobilemarketingcontent-first
Headspace preview

Headspace

MIT

Wellness-focused design system with vibrant accent colours and rounded, approachable typography; ideal for meditation, mental health and wellbeing applications

Layout
039
lightboldcontent-firstmobile
ElevenLabs preview

ElevenLabs

MIT

Modern SaaS design system with pill-shaped components, custom Waldenburg typography, and a light eggshell aesthetic suited for developer tools and voice-tech platforms

Layout
025
lightsaasdeveloper-toolminimal
Pinterest preview

Pinterest

MIT

A clean, accessible design system centred on Pinterest's signature red, featuring a light palette with custom CSS variables and Pin Sans typography for modern web applications

Layout
026
lightsaascontent-firstdashboard
Dovetail preview

Dovetail

MIT

A dark-first React component system with precise spacing and restrained typography, built for product teams prioritising clarity and developer efficiency

Layout
025
darkminimaldeveloper-toolsaas
Shopify preview

Shopify

MIT

Dark, sophisticated commerce design system with teals and blacks, optimised for merchant dashboards and high-conversion product pages

Layout
021
darkecommdashboardsaas
Microsoft preview

Microsoft

MIT

Clean, professional design system with Segoe UI typography and subtle greys—built for enterprise SaaS and corporate web platforms

Layout
053
lightminimalsaas
PostHog preview

PostHog

MIT

Developer-focused analytics design system with warm amber CTAs, IBM Plex Sans typography, and precise 4px spacing grid for product interfaces and marketing sites

Layout
038
developer-toolsaasminimallight
Supabase preview

Supabase

MIT

A dark-first, developer-focused design system with emerald accents and a clean geometric aesthetic, built for modern SaaS and backend platforms

Layout
027
darkminimalsaasdeveloper-tool
Notion preview

Notion

MIT

Minimal, content-first design system with clean typography and subtle interactions, built for productivity tools and knowledge work platforms

Layout
023
minimallightcontent-firstsaas
Runway preview

Runway

MIT

Warm, accessible design system with amber accents and refined typography, suited to modern SaaS and content-driven products

Layout
024
lightsaascontent-first
Claude preview

Claude

MIT

Sophisticated, warm design system with clay and oat tones, built for a modern AI assistant brand that values clarity and elegance

Layout
032
lightminimalsaasdeveloper-tool
Stripe preview

Stripe

MIT

Clean, developer-focused design system with vibrant purple accent, refined typography, and precise spacing—built for fintech and SaaS platforms

Layout
022
lightminimalfintechsaas
Cursor preview

Cursor

MIT

Refined developer-focused design system with warm amber accents, serif body typography, and precise spacing tokens for AI tooling interfaces

Layout
036
developer-toollightminimal
Revolut preview

Revolut

MIT

Modern fintech design system built on Next.js with carefully orchestrated typography, spacing, and motion tokens optimised for responsive financial products

Layout
022
fintechsaaslightminimal
Apple preview

Apple

MIT

Apple's refined, light design system built on SF Pro typography with subtle grays, precise spacing, and purposeful motion—ideal for premium product experiences and polished web interfaces

Layout
074
lightminimalsaas
Linear preview

Linear

MIT

Minimal dark-first design system for a modern developer tool, built on cool grays and purple accents with refined typography and subtle interactions

Layout
069
darkminimaldeveloper-toolsaas
Ramp preview
Rich kit

Ramp

MIT

Clean, modern fintech design system with warm typography and purposeful colour accents for financial software interfaces

Layout
031
lightminimalfintechsaas
Airtable preview

Airtable

MIT

Clean, professional SaaS design system built on a structured token foundation with Neue Haas Grotesk typography, subtle shadows and a blue-dominant colour palette suited to productivity and enterprise tools

Layout
016
saasdeveloper-toolminimallight