Modern Elite
The design language of Linear, Stripe, and Vercel. Dark-mode first, glow-driven, hyper-polished. It says 'this product was built with care' before users even click.
Don't let LLMs decide your brand. Copy-paste battle-tested design rules to force ChatGPT, Claude, and v0 to generate high-end, intentional interfaces instantly.
Engineered for
How it works
Browse the curated design systems. Each has a distinct personality, use case, and set of rules.
Each style includes a ready-to-paste skill prompt with exact colors, typography, spacing, and component rules.
Drop it into ChatGPT, Claude, Cursor, v0, or any AI tool. Ask it to apply the guidelines to your UI.
Instead of generic defaults, your AI output now follows a specific design direction — with personality and purpose.
Find Your Style
Not sure where to start? Pick what you're building and jump straight to styles that fit.
Clean, conversion-focused, built to look credible from day one.
Let the work speak — minimal chrome, maximum clarity.
Product-first layouts that build trust and drive checkout.
Editorial weight that makes readers take you seriously.
Data-dense interfaces that stay legible under pressure.
Loud, memorable, impossible to scroll past.
Design Systems
Each comes with a full design brief — palette, typography rules, spacing guidelines, and a ready-to-paste skill prompt.
The design language of Linear, Stripe, and Vercel. Dark-mode first, glow-driven, hyper-polished. It says 'this product was built with care' before users even click.
Translucent panels floating above warm gradient fields. The design language Apple brought mainstream with macOS Big Sur — refined into a design system for consumer fintech, wellness, and lifestyle products. Not frosted glass as decoration. Frosted glass as material — surfaces that bend light, create layered depth, and make data feel soft enough to live with every day.
A design system rooted in the Bauhaus school (1919–1933) and Swiss International Typographic Style. Primary colors used as architectural blocks, strict asymmetric grids, geometric shape compositions, vertical type labels, and typography scaled to dominate structure. The design language of institutions, cultural organizations, and any brand that earns authority through discipline. Not minimalism — structured maximalism.
Black, white, and nothing else. All hierarchy through weight, size, space, and motion. A design system for brands that understand restraint is the most powerful statement — fashion houses, luxury agencies, independent studios, and any product that earns authority through typographic conviction rather than color.
A design system built entirely around the aesthetics of real terminal emulators — phosphor glow, monospace type, CRT scanlines, blinking cursors, ASCII box-drawing, typewriter animations, and an interactive shell. Not a dark theme with green text. An actual terminal, rendered as a product UI. For developer tools, CLI products, infrastructure platforms, and any technical product that wants its interface to feel like home to an engineer.
A design system built around editorial restraint — warm off-white base, ink-green primary, a single serif display face with genuine optical personality, and a layout that earns its whitespace through precision rather than emptiness. Built here for Content Bakerz, a blog writing studio positioning against AI content floods. Equally right for agencies, consultancies, legal firms, publishing platforms, and any service brand where authority is built through words, not decoration.
A modern casual restaurant website built around food photography and real conversion goals. Warm peach hero with split text-left photo-right layout, tabbed menu with circular dish images and dotted-border treatment, a bento-grid deals section, WhatsApp order button, and a phone number in the nav. Designed to feel like a real restaurant site people actually order from — not a template.
A team collaboration chat interface in the style of Slack and Discord. Three-column layout: workspace switcher → channel sidebar → message thread. Fully interactive with channel switching, live message sending, emoji reactions, typing indicators, and a collapsible member panel. Built for developers building internal tools, communication platforms, customer support portals, or any product that needs a real-time messaging interface.
A split-screen developer portfolio with a cinematic name splash, sticky left bio panel, and scrollable right panel for experience and projects. Deep navy background, cyan accent links, pill-shaped skill tags, and a two-tab layout that lets recruiters switch between your work history and your builds. Used by engineers who want their portfolio to feel like a product — not a resume.
Rounded 3D-inflated shapes, pastel colors, and thick colored bottom shadows that give UI elements a clay-like physical depth. Every button feels pressable, every card feels molded. The friendly tech aesthetic used by Duolingo, wellness apps, and consumer products that want to feel approachable, rewarding, and alive.
A content-first SaaS landing page style built for indie founders and solo makers — no gradients, no hero images, no UI chrome. Just a floating document on an off-white page: big bold headlines, personal voice copy, 1px-rule section dividers, pill buttons, and hand-drawn line-art illustrations. The design language of products that ship.
A design system that mimics pencil sketches, rough strokes, and imperfect geometry. Perfect for creative tools, portfolios, and products that want to feel genuinely human in a world of pixel-perfect AI output.
A design system rooted in architectural drafting, mechanical schematics, and technical documentation. Aged paper or vellum backgrounds, fine dashed grid lines, annotation callouts, dimension markers, and a monospace-meets-drafting-pen aesthetic. The design language of precision engineering and technical mastery.
A complete dashboard design system with gradient metric cards, real interactive charts, multicolor donut breakdowns, and a dual-rail sidebar. Clean enough to scale, vivid enough to make data feel alive — the dashboard style of modern SaaS analytics products.
A complete dark-mode documentation site design system — sticky navbar, collapsible left navigation, content column with code blocks and callouts, and a right-side table of contents. The layout used by Next.js, Vite, Stripe, and every serious developer-facing product.
A complete newsletter publication design system — hero masthead, asymmetric article grid, author profile, and signup form. Warm paper tones, serif display headings, and an editorial layout inspired by Substack, Every.to, and the best independent newsletters. Includes a full AI prompt and live HTML demo.
The design language of thick black borders, hard offset shadows, electric accent colors, and uncompromising grid discipline. NeoBrutalism takes Brutalism's rawness and adds color, hierarchy, and usability — the result is the boldest conversion-focused design style on the web.
A complete quiz application design system — from splash screen to results review. Purple-to-pink gradient identity, white floating cards on lavender backgrounds, large question numbering, color-coded answer states, and a full timer system. Every screen a user sees during a quiz flow, fully designed.
A complete landing page design system inspired by broadsheet newspaper front pages. True multi-column grids with column rules, a dense masthead, breaking-news ribbon, opinion section, classifieds-style CTAs, and a "subscription rates" pricing table. Every section feels like a page from a serious publication.
The design system behind product launch platforms and community directories. Three-column layouts with a product feed in the center, stats and activity on the left, search and ads on the right. Upvote buttons, rank badges, countdown timers, and partner slots — everything a product launch community needs.
The design language of solo founders and indie hackers — warm cream backgrounds, bubbly display headlines with dark stroke, monospace body text, and dark card panels that punch through the page. Playful without being childish. Scrappy without being rough.
A complete e-commerce design system built around product discovery and purchase. Warm peach product cards, orange CTAs, clean white layouts, and every component a modern online store needs — hero, product grid, product detail, cart, and footer.
A complete authentication UI design system with login, signup, and forgot password pages. Split-screen layout with a green brand panel on the right featuring testimonials and social proof, and a clean white form on the left. Every detail is designed to reduce sign-up friction.
Style Explorer
Open the interactive explorer to switch between design systems instantly, preview live HTML demos, and find the perfect look for your project.
Open Style ExplorerLive HTML previews
See every style in action
Desktop & mobile
Toggle viewport sizes
Instant switching
Compare in one click
Color Palettes
See the exact color systems behind each style. Click any swatch to copy its hex value.
Engineered light. Polished to perfection.
Dark mode SaaS layoutFrosted glass. Morning light. Depth without weight.
Frosted glass layoutForm follows function. Grid is law. Color is structure.
Geometric grid layoutZero color. Maximum craft. Nothing to hide behind.
Zero color layoutCommand-line aesthetic. Zero decoration. Pure signal.
CLI hacker layoutEvery word earns its place. Every pixel does a job.
FAQ