Design Gallery
Pre-extracted DESIGN.md files from public sites. Colors, typography, spacing, and tokens, ready to drop in a repo. Open a card to preview and copy.
Airbnb | Vacation rentals, cabins, beach houses, & more
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
Apple
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
ChatGPT
ChatGPT employs a clean, minimal design system focused on conversation and usability. The interface uses a monochromatic color palette with subtle grays, rounded corners, and generous spacing to create a calm, approachable environment for AI interaction. The design prioritizes readability and reduces visual noise to keep focus on the conversation.
Dribbble - Discover the World’s Top Designers & Creative Professionals
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
Figma
Figma employs a clean, minimal design system with strong black and white contrast, custom typography (Figma Sans), and generous spacing. The interface prioritizes clarity and accessibility with high contrast ratios, rounded corners for friendliness, and a sophisticated monochromatic palette with occasional colorful accents. The design emphasizes functionality over decoration, using subtle shadows and consistent spacing to create hierarchy.
Home \ Anthropic
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
Jira
Jira employs Atlassian's mature design system featuring the Charlie font family, a blue-dominant color palette with strong contrast ratios, and generous spacing. The design emphasizes clarity and functionality with rounded corners, subtle shadows, and a clean information hierarchy suitable for project management workflows.
Klarna
Klarna's design system features a sophisticated dark navy primary color (#0b051d) with bright accent colors including their signature pink (#ffa8cd). The system uses custom Klarna fonts alongside system fonts, emphasizes rounded corners (32px being most common), and maintains high contrast for accessibility. The design balances professionalism with approachability through generous spacing and clear typography hierarchy.
Linear
Linear employs a sophisticated dark-first design system with exceptional typography hierarchy using Inter Variable and Berkeley Mono. The interface features subtle gradients, minimal shadows, and a carefully crafted neutral color palette that prioritizes readability and focus. The design emphasizes content over decoration with generous whitespace and precise spacing relationships.
Lovable
Lovable features a modern, gradient-driven design with a vibrant blue-to-pink background that creates an engaging, AI-focused aesthetic. The design emphasizes conversational interaction through a prominent chat interface, clean typography using Camera Plain Variable font, and subtle shadows for depth. The interface balances visual appeal with functionality, using rounded corners and a neutral color palette for UI elements against the colorful gradient backdrop.
Neon Serverless Postgres — Ship faster
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
Railway | The all-in-one intelligent cloud provider
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
Shopify
Shopify's design system features a clean, modern aesthetic with a distinctive green brand accent (#36f4a4). The design emphasizes accessibility and clarity with high contrast ratios, generous spacing, and a sophisticated typography hierarchy using NeueHaasGrotesk and Inter fonts. The interface balances professionalism with approachability through rounded corners, subtle shadows, and a neutral color palette dominated by grays and whites.
Snapchat
Snapchat's design system features a bold, playful aesthetic with high contrast between light and dark themes. The signature bright yellow (#fffc00) serves as the primary brand color, complemented by clean typography using Avenir Next and Graphik. The interface emphasizes rounded corners (20px being most common) and uses generous spacing to create a mobile-friendly, accessible experience. The design balances fun visual elements with functional clarity.
Stripe
Stripe's design system features a clean, professional aesthetic with a distinctive purple brand color (#533afd) as the primary accent. The design emphasizes trust and reliability through generous white space, subtle shadows, and a sophisticated color palette of blues and grays. Typography is handled by the custom Sohne variable font, providing excellent readability and modern appeal. The system uses consistent 8px-based spacing and gentle border radii (4-6px) to create a polished, approachable interface suitable for financial services.
Supabase | The Postgres Development Platform.
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
The AI workspace that works for you. | Notion
Design tokens extracted from CSSOM frequency analysis without LLM interpretation.
The Onion
The Onion employs a traditional news website design with a clean, content-focused layout. The design features a distinctive green primary color (#006b3a) that serves as the brand accent, paired with classic black text on white backgrounds. The typography system uses a mix of serif fonts (Utopia Std Caption for body text) and condensed sans-serif fonts (Tablet Gothic family) for headlines, creating a newspaper-like hierarchy. The layout emphasizes readability with generous spacing and clear content sections.
Uber
Uber's design language combines clean minimalism with vibrant illustrations to create an approachable yet professional transportation platform. The stark black-and-white foundation provides clarity and readability, while colorful hero illustrations add warmth and human connection. Typography relies on the custom UberMove family for brand consistency, with generous spacing creating breathing room throughout the interface.
Vercel
Vercel's design language embraces clean minimalism with a sophisticated developer-first aesthetic. The interface uses generous whitespace, subtle gradients, and a refined color palette anchored by deep charcoal text on pristine white backgrounds. Typography is crisp and functional, leveraging the custom Geist font family for excellent readability across technical content.
WIRED
WIRED employs a sophisticated editorial design system that balances minimalist aesthetics with typographic hierarchy. The design features a distinctive monospace font for metadata, clean sans-serif typography for content, and strategic use of black and white with subtle accent colors. The layout emphasizes readability and content consumption with generous whitespace and clear visual hierarchy.
xAI
xAI employs a striking cosmic-themed design with a dramatic dark gradient background featuring blue-to-white light effects. The design centers around a large, semi-transparent "Grok" wordmark that creates depth through layered opacity. The interface is minimal with clean typography using custom fonts (universalSans and GeistMono), rounded buttons, and a sophisticated dark color palette punctuated by bright white text and accents.
Don’t see the site you need?
Paste any URL and get a structured design system in seconds. Colors, typography, spacing, and tokens, ready for your AI workflow.