/Catalogue/Prompt/rohitg00/rohitg00-awesome-claude-design-awesome-claude-design

Origin: github

Communityv0.1.0PromptLicense: MIT github.com/rohitg00/awesome-claude-design

Awesome Claude Design

Claude Design DESIGN.md prompts by aesthetic family, remix recipes, skills, video teardowns, X signal, honest community takes.

by rohitg00 · updated 5mo ago · imported from GitHub

Watch · 0 Send for moderation

Installs0+0/7d

Security score100/100

Retention 14d0%

GitHub stars1.1K

Skill logic

0 tools · +0 prompt lines · 3 steps

Execution graph

README

View on GitHub ↗

Awesome Claude Design

Claude Design — Anthropic Labs' AI design workspace. DESIGN.md files grouped by aesthetic family, remix recipes, prompt packs with example outputs, skills, video teardowns, and launch-week community signal.

Claude Design shipped April 17, 2026. Figma closed −4.26% the same day. YouTube split between "RIP frontend developers" and "another slop feature." This repo collects both.

Heads up — typo-squat alert. A repo named anthropic-claude-design/claude-design claiming to "download Claude Design" is NOT affiliated with Anthropic. The real product lives at claude.ai/design behind a Pro/Max/Team/Enterprise login. No download exists. Report the typo-squat.

Preview Gallery

What each aesthetic family actually looks like in production. Thumbnails are static screenshots of the public homepage of one representative brand per family. Click the image to open the live site, click the caption to open the working DESIGN.md in this repo.

<table> <tr> <td align="center" width="33%"> <a href="https://linear.app"><img src="assets/previews/linear.jpg" width="100%" alt="Linear — editorial minimalism"></a> <a href="design-md/editorial/linear.md">Linear · editorial</a> <code>#fff / #0f0f14 / #5e6ad2</code> </td> <td align="center" width="33%"> <a href="https://ollama.com"><img src="assets/previews/ollama.jpg" width="100%" alt="Ollama — terminal-core"></a> <a href="design-md/terminal/ollama.md">Ollama · terminal</a> <code>#000 / #fff / mono</code> </td> <td align="center" width="33%"> <a href="https://www.anthropic.com"><img src="assets/previews/anthropic.jpg" width="100%" alt="Anthropic / Claude — warm editorial"></a> <a href="design-md/warm/claude.md">Claude · warm</a> <code>#f4f3ee / #c96442 / #191817</code> </td> </tr> <tr> <td align="center" width="33%"> <a href="https://clickhouse.com"><img src="assets/previews/clickhouse.jpg" width="100%" alt="ClickHouse — data-dense pro"></a> <a href="design-md/data-dense/clickhouse.md">ClickHouse · data-dense</a> <code>#181818 / #faff69 / magenta</code> </td> <td align="center" width="33%"> <a href="https://runwayml.com"><img src="assets/previews/runwayml.jpg" width="100%" alt="RunwayML — cinematic dark"></a> <a href="design-md/cinematic/runway.md">Runway · cinematic</a> <code>#000 / magenta + cyan</code> </td> <td align="center" width="33%"> <a href="https://www.figma.com"><img src="assets/previews/figma.jpg" width="100%" alt="Figma — playful color"></a> <a href="design-md/playful/figma.md">Figma · playful</a> <code>#0acf83 / #f24e1e / #a259ff</code> </td> </tr> <tr> <td align="center" width="33%"> <a href="https://arc.net"><img src="assets/previews/arc.jpg" width="100%" alt="Arc Browser — glass / soft-futurism"></a> <a href="design-md/glass/arc.md">Arc · glass</a> <code>#fff / radial pastel</code> </td> <td align="center" width="33%"> <a href="https://www.theverge.com"><img src="assets/previews/theverge.jpg" width="100%" alt="The Verge — neon brutalist"></a> <a href="design-md/brutalist/the-verge.md">The Verge · brutalist</a> <code>#ff6600 / #000 / #fff</code> </td> <td align="center" width="33%"> <a href="https://www.granola.ai"><img src="assets/previews/granola.jpg" width="100%" alt="Granola — cult / indie"></a> <a href="design-md/indie/granola.md">Granola · indie</a> <code>#faf8f2 / warm glass</code> </td> </tr> </table>

Screenshots are public-homepage stills used for editorial reference. Trademarks remain with their respective owners. See <a href="assets/previews/ATTRIBUTION.md">ATTRIBUTION.md</a> for source URLs and refresh policy.

What Is Claude Design

Anthropic Labs product. Conversation-to-artifact loop for prototypes, design systems, slides, one-pagers, landing pages, marketing graphics, brand videos. Powered by Claude Opus 4.7 (vision model). Research preview on Pro, Max, Team, Enterprise plans. Rolling out throughout launch day.

Three surfaces:

Prototypes — from text, screenshot, Figma .fig, repo URL, or scraped live site
Design systems — persistent per-project tokens/components via DESIGN.md; teams hold multiple
Collateral — pitch decks, marketing pages, carousels, one-time posts, brand videos

Video Teardowns

Click thumbnail. View counts refresh live via shields.io.

<table> <tr> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=IkspcJdeP3U"><img src="https://img.youtube.com/vi/IkspcJdeP3U/mqdefault.jpg" width="220"></a> Malewicz <img src="https://img.shields.io/youtube/views/IkspcJdeP3U?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/IkspcJdeP3U?style=flat-square&label=likes&color=c96442"> Skeptical senior-designer teardown </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=o4jIKc_DIoM"><img src="https://img.youtube.com/vi/o4jIKc_DIoM/mqdefault.jpg" width="220"></a> 02ui · Murat Bayral <img src="https://img.shields.io/youtube/views/o4jIKc_DIoM?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/o4jIKc_DIoM?style=flat-square&label=likes&color=c96442"> vs Lovable head-to-head </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=uhQfErAzdiA"><img src="https://img.youtube.com/vi/uhQfErAzdiA/mqdefault.jpg" width="220"></a> WorldofAI <img src="https://img.shields.io/youtube/views/uhQfErAzdiA?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/uhQfErAzdiA?style=flat-square&label=likes&color=c96442"> Hype walkthrough </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=Qct36RA3y9k"><img src="https://img.youtube.com/vi/Qct36RA3y9k/mqdefault.jpg" width="220"></a> Ray Fernando <img src="https://img.shields.io/youtube/views/Qct36RA3y9k?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/Qct36RA3y9k?style=flat-square&label=likes&color=c96442"> Live blog redesign </td> </tr> <tr> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=A2eEv3KYGPg"><img src="https://img.youtube.com/vi/A2eEv3KYGPg/mqdefault.jpg" width="220"></a> Vivek Mishra <img src="https://img.shields.io/youtube/views/A2eEv3KYGPg?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/A2eEv3KYGPg?style=flat-square&label=likes&color=c96442"> Launch-day walkthrough </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=4q2F4zblOLQ"><img src="https://img.youtube.com/vi/4q2F4zblOLQ/mqdefault.jpg" width="220"></a> AI for Work <img src="https://img.shields.io/youtube/views/4q2F4zblOLQ?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/4q2F4zblOLQ?style=flat-square&label=likes&color=c96442"> System from prompt </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=vyLaimDeK_g"><img src="https://img.youtube.com/vi/vyLaimDeK_g/mqdefault.jpg" width="220"></a> Greg Isenberg <img src="https://img.shields.io/youtube/views/vyLaimDeK_g?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/vyLaimDeK_g?style=flat-square&label=likes&color=c96442"> Hands-on edges </td> <td align="center" width="25%"> <a href="https://www.youtube.com/watch?v=Hcvkc1XUhMg"><img src="https://img.youtube.com/vi/Hcvkc1XUhMg/mqdefault.jpg" width="220"></a> Ramanpal Singh <img src="https://img.shields.io/youtube/views/Hcvkc1XUhMg?style=flat-square&label=views&color=191817"> <img src="https://img.shields.io/youtube/likes/Hcvkc1XUhMg?style=flat-square&label=likes&color=c96442"> Beginner tutorial </td> </tr> </table>

Comparisons

Feature	Claude Design	Figma Make	Lovable	v0	Stitch	SuperDesign
Prompt → hi-fi	Yes	Yes	Yes	Yes	Yes	Yes
DESIGN.md native	Yes	No	Partial	No	Originated	Yes
Screenshot → system	Yes	No	Partial	No	Yes	Yes
Figma `.fig` import	Yes	Native	Yes	Partial	No	No
Web capture on live site	Native	No	Partial	No	No	Partial
Inline comments / knobs	Yes	Yes	No	No	No	No
Persistent per-project tokens	Yes	Yes	Partial	No	No	Yes
Org-scoped collab + group chat	Yes	Yes	No	No	No	No
Export paths	Canva/PDF/PPTX/HTML	Figma	Full-stack app	React	HTML	Local files
Multi-system per team	Yes	Yes	No	No	No	Yes
Open source	No	No	No	No	No	Yes (MIT)
Runs in your IDE	No	No	No	No	No	Yes
Underlying model	Opus 4.7	GPT-based	Claude/GPT	GPT + Claude	Gemini	BYO
Pricing	Pro/Max/Team/Ent.	Figma Pro add-on	Freemium	Freemium	Free beta	Free

Launch-week consensus: Claude Design wins design-system coherence, web capture, collaboration. Lovable wins full-stack shipping. Figma Make is safest for Figma teams. Stitch is strongest for pure token generation. SuperDesign is the only open-source option that lives inside the IDE.

More launch-week comparisons

TechCrunch — Anthropic launches Claude Design — mainstream-press launch framing: "quick visuals" tool, not a Figma killer
Adweek — Claude Design for marketing assets, decks, and UIs — agency angle, marketing-first read of the surface area
PYMNTS — Anthropic's design tool rivals Adobe and Figma — competitive positioning against the incumbent stack
Trending Topics — Anthropic challenges Lovable and Figma — EU coverage; Lovable framed as the closer competitor than Figma
Storyboard18 — Claude Design rattles design software giants — India-market read on the ripple to Figma/Adobe
Web And IT News — Hits Figma where it hurts — argues the wedge is non-designers, not designers
DEV (whoffagents) — CD vs Figma: what actually changed — practitioner side-by-side on when to reach for which
MindStudio — Claude Design vs Figma — feature-grid comparison from the AI-tools vendor angle
Magic Patterns — Claude Design vs Figma Make — narrow head-to-head on the prompt-to-prototype surface
eigent.ai — Claude Design vs Lovable, full 2026 comparison — pricing + output-quality split between design tool and full-stack builder
NxCode — Vibe design tools 2026: Stitch vs v0 vs Lovable vs Bolt — places Claude Design in the broader vibe-design landscape
Lushbinary — Claude Design vs Figma vs Canva vs Stitch — four-way matrix including Canva, the export target

Showcase

Real builds shipped with Claude Design — launch-week seed of 10 cards (Tom's Guide pizza brand in 30 min, Peter Yang's 16-min everything build, Mercury's 90% inference, Brilliant 20→2 prompts, Datadog week→1-conversation, and more).

See showcase/README.md. Submit your own via the Showcase Submission issue template or PR.

Community Takes

Hype

"Would suck to be Figma right now." — r/ClaudeAI launch thread

"After 29 years of being a designer, this is the only better way of working." — AI for Work

"The design system integration feels best in class for AI." — @petergyang

Mejba Ahmed — The visual layer Claude Code was missing — engineer-positive read: closes the visual gap in the Claude Code loop

Pushback

"Just tested it. This is only hype for people that never worked with real UX/UI designers. Another slop feature that will burn tokens." — r/ClaudeAI

"Anthropic is saying 'look at this hand, see the coin?' — I'm going to open the hand, and the coin is not there. But it was never there. The whole goal was so you're not looking at the other hand while they're taking your subscription money." — Malewicz

"Was Google Stitch or Microsoft Designer or Template Monster the quality of a mid-level designer? No. Is this?" — Malewicz, same video

"Stickley wouldn't have stained pine to look like oak. Truth to materials means the interface should reveal what built it, not pretend to be hand-drawn when it was assembled." — Sam Henri Gold, Tavus designer, framing Claude Design through Arts-and-Crafts and predicting a CD↔Claude Code two-way feedback loop

"Anthropic debuts Claude Design — because who needs designers?" — The Register, launch-day headline

"If your job was the comps, your job was always going to go. The design was never the comps." — Christopher Noessel, IxDA author, after Claude Design dumped a dozen screens on him in one sitting

"The designers it replaces are not the designers you were worried about replacing." — Malewicz — Will Claude Design replace designers?, companion long-form piece to the YouTube teardown

Abhi Chatterjee — Designer's first walkthrough — burned ~50% of weekly allotment on one design system + one prototype; trained eyes still spot spacing inconsistencies
PCWorld — I tried Claude Design for half an hour, I'm already locked out for a week — 30-minute session exhausted the weekly allowance

The market

Figma (NYSE: FIG) closed −4.26% on launch day. Intraday low ~−7% per r/FigmaDesign. Adobe unchanged.

Victoria Okwuokenye — Claude Design full breakdown — feature-by-feature read of where Claude Design lands against the incumbent design stack
BSWEN — Good enough for professional websites? — output-quality bar test; argues the gap to "pro site" is narrower than the discourse claims

The fine print

"Fun but burns through usage quickly." — @petergyang

Early Opus 4.7 hallucination reports on long tasks: r/ClaudeCode thread — "$120 of API credits, by god is it bad."

Ocasio Consulting — Claude Design review — direct ask for a flat design-seat fee; "rationing creativity goes against the spirit" of the tool

Forum Pulse

Engineer-class community takes from Hacker News — three threads, three angles.

HN #47806725 — main launch thread — competent UI, nothing mind-blowing yet
HN #47818700 — "Thoughts and feelings around Claude Design" — 95% of weekly usage gone in a sitting; plaything-not-tool critique
HN #47832366 — "Figma's woes compound with Claude Design" — leaf-node output vs full design lifecycle; Figma exposure compounds

Feature Map

Capability	Detail
Brand onboarding	Claude reads codebase + design files, builds system automatically on first run
Web capture	Grab live elements from your site so prototypes match production
File imports	DOCX, PPTX, XLSX, images, Figma `.fig`, repo URL, text
Inline comments	Comment on specific elements the way you would in Figma
Adjustment knobs	Live sliders for spacing, color, layout — apply across the design
Design-system coverage	Colors, typography, components, preview cards, working UI kit, exportable `SKILL.md`
Collaboration	Org-scoped sharing — private, view-only, edit access with group Claude chat
Export	Canva, PDF, PPTX, standalone HTML, shareable internal URL, saved folder
Code handoff	Bundle → Claude Code with one instruction (CSS vars + component stubs)
Frontier features	Voice, video, shaders, 3D, built-in AI outputs
Videos	Per @petergyang: "creates beautiful videos, more so than slides"

Launch Timeline

Date	Event	Source
2026-04-10	Canva announces Anthropic collaboration (Canva Foundation Design Model partnership) at Canva Create LA	Canva newsroom · Morningstar / BusinessWire
2026-04-14	The Information leaks Opus 4.7 + design tool	r/singularity +889
2026-04-14	Mike Krieger (Anthropic CPO) steps off Figma board — pre-launch signal	Martin Alderson
2026-04-17	Claude Design + Opus 4.7 ship in research preview	anthropic.com
2026-04-17	Official launch tweet	@claudeai
2026-04-17	r/ClaudeAI launch thread hits 2,293 upvotes	Reddit
2026-04-17	Figma closes −4.26% (second thread 1,763 upvotes)	Reddit · @brewmarkets
2026-04-17	r/FigmaDesign reports ~7% intraday dip	Reddit
2026-04-17	Mainstream press wave — TechCrunch, VentureBeat, Adweek frame the launch	TechCrunch · VentureBeat · Adweek
2026-04-17	Austin Lau (Anthropic growth marketer) — first-party Tweaks-panel demo + Claude Cowork landing-page recreation	@helloitsaustin
2026-04-18	Teardown wave: Isenberg, Malewicz, 02ui, Ray Fernando, WorldofAI, Vivek Mishra, AI for Work	See Video Teardowns
2026-04-18	@petergyang 16-min build: video + slides + website + app + design system	Tweet
2026-04-18	Sam Henri Gold publishes "Stickley joinery" framing post	samhenri.gold
2026-04-18	Brilliant + Datadog case studies surface in Anthropic launch post	anthropic.com
2026-04-18	MacStories hands-on by John Voorhees — Apple-press POV; "comment-on-element covered 95% of what's needed"	macstories.net
2026-04-19	Ryan Mather publishes 7-tip thread (system-first, comments-not-chat, connectors)	@Flomerboy
2026-04-19	ADPList community surfaces "10x designer with Claude Design" framing — `/packages/ui` subdirectory pro-tip	adplist.substack.com
2026-04-20	Follow-on coverage — "hits Figma where it hurts" / "rattles design giants"	Web And IT News · Storyboard18
2026-04-21	Pricing controversy — Pro tier loses Claude Code access	Pasquale Pillitteri
2026-04-21	DESIGN.md spec open-sourced by Google (Stitch / Google Labs)	blog.google
2026-04-22	Anthropic publishes Claude Design subscription usage + pricing doc	support.claude.com
2026-04-22	Post-launch coverage consolidates — Lenny mini-episode + Quasa.io tips + Anthropic pricing doc	Lenny's Newsletter · Quasa.io · support.claude.com

Quotas & Token Budget

Quota burn is the #2 community complaint after AI-slop fingerprints. Here's the math + the recipe so you don't lose a week to a single prompt.

Separate meter from chat. Claude Design has its own usage meter, distinct from regular Claude.ai chat — per the Anthropic pricing doc.
Per-user, not pooled. Weekly allowance is per-seat — teams cannot share a pool — per the Anthropic pricing doc.
One-time promotional credit. Roughly 20 typical prompts, expiring 2026-07-17 — per the Anthropic pricing doc. Spend it on experiments, save weekly allowance for production.
Vision tokens cost ~3x text. Opus 4.7 vision pricing is broadly cited; every screenshot, .fig, or web-capture inflates the bill.
Pro can exhaust in 2–3 prompts. Multiple reports on the r/ClaudeAI launch thread of two prompts eating 95% of a weekly limit.
30 minutes → locked out for a week. PCWorld review burned the full allowance in one sitting.
50% of weekly allotment for one design system + one prototype. Designer field report from Abhi Chatterjee.
"Rationing creativity goes against the spirit." Ocasio Consulting calls directly for a flat design-seat fee.
Concrete USD costs on Max-5x: $3 landing / $4 video / $7 deck. CopyRocket AI tested on a real brand and burned 90% of weekly allowance in 4–5 prompts. Definitive token-budget reference.
Image generation is "powered in part by Canva." Lalindra (Pen With Paper) surfaces that Claude Design's image generation routes through the Canva Design Engine partnership — explains some of the quota dynamics around visual exports.

Recommended sequence: recipes/token-budget-claude-design.md — scaffold once, cap reference screens at 4, switch to inline comments for iteration, branch for variants, bundle to Claude Code in one shot.

Full pricing reference: Claude Design subscription usage and pricing — support.claude.com.

Official Resources

Launch — anthropic.com/news/claude-design-anthropic-labs
Product — claude.ai/design
Anthropic Labs
Anthropic Prompt Library — Brand builder, Website wizard, Prose polisher, 40+ more
anthropics/skills — frontend-design SKILL.md — the underlying skill Claude Design routes through; auto-loaded by Claude Code for UI work
anthropics/skills PR #210 — clarity revision; 75% win rate across model tiers, biggest lift on Haiku
anthropics/claude-cookbooks — frontend aesthetics notebook — Anthropic's own anti-slop primer; quoted in Anti-Slop Kit
Claude Cookbooks — prompting_for_frontend_aesthetics.ipynb
Prompt engineering overview
Prompt generator (Console)

X Signal

Launch-week reactions with receipts.

Handle	Angle	Quote	Link
@claudeai	Official	"Introducing Claude Design by Anthropic Labs. Powered by Claude Opus 4.7, our most capable vision model."	Tweet
@petergyang	Hands-on PM	"Design system integration feels best in class for AI. Creates beautiful videos, more so than slides. Fun but burns through usage quickly."	Tweet
@brewmarkets	Markets	"Figma stock is tumbling after Anthropic introduces Claude Design."	Tweet

Submit more: handle, verbatim quote ≤280 chars, tweet URL, engagement numbers.

DESIGN.md by Aesthetic Family

Not sorted by industry. Sorted by visual character — because that's how designers actually pick. Each family links to (1) a working DESIGN.md in /design-md/<family>/, (2) canonical external references, (3) a one-line swatch + type spec so you can eyeball fit before cloning.

Shipped samples in this repo: warm/claude.md · warm/mercury.md · terminal/ollama.md · terminal/warp.md · terminal/opencode.md · editorial/linear.md · editorial/vercel.md · data-dense/clickhouse.md · data-dense/posthog.md · data-dense/datadog.md · data-dense/mongodb.md · cinematic/runway.md · cinematic/tavus.md · cinematic/cohere.md · cinematic/nvidia.md · cinematic/minimax.md · cinematic/bmw.md · cinematic/ferrari.md · cinematic/lamborghini.md · cinematic/renault.md · playful/figma.md · playful/canva.md · playful/toss.md · glass/arc.md · glass/apple.md · brutalist/the-verge.md · indie/granola.md · remix/linear-x-claude.md · remix/warp-x-sentry.md · remix/stripe-x-a24.md · remix/vercel-x-pitchfork.md · remix/granola-x-criterion.md · remix/ollama-x-elevenlabs.md · remix/notion-x-duolingo.md · remix/mercury-x-linear.md

1. Editorial Minimalism

Calm neutrals, serif or narrow-grotesque headlines, generous line-height, single accent. Built for reading, pricing pages, docs.

Brand	Swatch	Type	External reference
Linear	`#fff / #0f0f14 / #5e6ad2`	Inter / Söhne	linear.app
Stripe	`#fff / #0a2540 / #635bff`	Sohne / Camphor	stripe.com
Vercel	`#fff / #000 / single grayscale ramp`	Geist	vercel.com
Mintlify	`#fff / #0c0c0e / green accent`	Inter reading-optimized	mintlify.com

2. Terminal-Core

Monospace everywhere, phosphor-green or amber on near-black, hard edges, CLI metaphors.

Brand	Swatch	Type	External reference
Ollama	`#000 / #fff / no accent`	Mono	ollama.com
Warp	`#0b0d14 / #16d5e6 / #ff7a59`	Roobert + JetBrains Mono	warp.dev
Raycast	`#1d1d1f / #ff6363 / white`	Custom sans + mono	raycast.com
OpenCode	`#080808 / #d2d2d2 / green`	IBM Plex Mono	opencode.ai

3. Warm Editorial

Terracotta, cream, clay. Serif body, approachable, human. Claude's own brand sits here.

Brand	Swatch	Type	External reference
Claude / Anthropic	`#f4f3ee / #c96442 / #191817`	Styrene / Tiempos	anthropic.com
Notion	`#fff / #37352f / warm grays`	Segoe + Lyon serif	notion.so
Resend	`#0a0a0a / #fff / mono accents`	Söhne + GT America Mono	resend.com
Substack	`#fff / #1a1a1a / #ff6719`	Spectral + SF Pro	substack.com

4. Data-Dense Pro

Charts are the hero. Tight spacing, saturated categorical palette, fixed-width numerals, dark-first dashboards.

Brand	Swatch	Type	External reference
ClickHouse	`#181818 / #faff69 / magenta`	Inter tabular	clickhouse.com
PostHog	`#1d4aff / #f9bd2b / #000`	Matter + Mono	posthog.com
Grafana	`#111217 / #f47c1b / multi-series`	Inter	grafana.com
Sentry	`#362d59 / #f6827d / #584774`	Rubik	sentry.io
Supabase	`#171717 / #3ecf8e`	Custom + mono	supabase.com
MongoDB	`#001e2b / #00ed64 / #00684a`	Euclid Circular A + Source Code Pro	mongodb.com

5. Cinematic Dark

Film-grade gradients, oversized type, motion-forward, media-heavy hero. Built for AI products and creator tools.

Brand	Swatch	Type	External reference
RunwayML	`#000 / saturated magenta + cyan`	Custom grotesque	runwayml.com
ElevenLabs	`#0a0a0a / electric blue / wave motifs`	Inter	elevenlabs.io
Minimax	`#000 / neon lime on charcoal`	Custom + mono	minimax.ai
Midjourney	`#000 / earth tones + lilac`	Editorial serif	midjourney.com
NVIDIA	`#000 / #76b900 signature green / #ffffff`	NVIDIA Sans / Helvetica Neue	nvidia.com
BMW	`#fff / #1c69d4 corporate blue / M-gradient`	BMW Type Next Web + Helvetica Neue	bmw.com
Ferrari	`#000 / #fff / #eb2323 Rosso Corsa`	FerrariSans	ferrari.com
Lamborghini	`#000 / #ffc000 warm gold / hex motif`	LamboType + Roboto	lamborghini.com
Renault	`#fff / aurora yellow→magenta→cyan / #efdf00 + #e91630`	NouvelR	renault.fr

6. Playful Color

High-saturation, illustrated accents, rounded corners, decorative shapes. Consumer-friendly.

Brand	Swatch	Type	External reference
Figma	`#0acf83 / #f24e1e / #a259ff / #ff7262 / #1abcfe`	Inter + Whyte	figma.com
Clay	`#f6e9c9 / organic shapes / soft gradients`	Söhne	clay.com
Duolingo	`#58cc02 / #fff / #ff4b4b`	DIN Rounded	duolingo.com
Mailchimp	`#ffe01b / #000`	Cooper Hewitt + GT America	mailchimp.com
Cal.com	`#292929 / #fff / single accent`	Inter	cal.com
Toss	`#fff / #3182f6 Toss Blue / #191f28`	Toss Product Sans + Noto Sans KR	toss.im

7. Glass / Soft-Futurism

Frosted blur, layered translucency, soft gradients, Apple-adjacent. Premium consumer feel.

Brand	Swatch	Type	External reference
Apple	`#fff / #1d1d1f / system colors`	SF Pro	apple.com
Arc Browser	`#fff / radial pastel gradients`	Custom	arc.net
Airbnb	`#fff / #ff385c / #222`	Cereal	airbnb.com
Granola	`#faf8f2 / warm glass`	Editorial serif	granola.ai
Spotify	`#000 / #1db954`	Circular	spotify.com

8. Neon Brutalist

Hard edges, deliberate-ugly type mixing, oversized numerals, saturated single hue. Statement pieces.

Brand	Swatch	Type	External reference
Bugatti	`#0d1321 / electric blue / chrome`	Custom + GT America	bugatti.com
PlayStation	`#000 / full-spectrum prism`	SST	playstation.com
The Verge	`#ff6600 / #000 / #fff`	Polysans + editorial serif	theverge.com
Pitchfork	`#fff / #000 / #ff5d1f`	Editorial serif	pitchfork.com

9. Cult / Indie Picks (non-Fortune-500)

Brands VoltAgent's catalog does NOT cover — indie SaaS, cult to

Discussion

0 comments

No comments yet — start the thread.

Security report

Grade: A+

Security audit score100/ 100

Community

Eligible for Verified review

[PASS] Prompt injection resistanceNo override, role-hijack or hidden-instruction patterns in prompt and tool text.
[PASS] Shell command sandboxingNo destructive, privilege-escalating or reverse-shell commands in scripts.
[PASS] Zero secret leakageNo literal API keys or tokens; env values are ${VAR} references.
[PASS] Network egress isolationNo patterns that ship context or credentials to external hosts.
[PASS] Minimal permission scopeDeclared permissions match what the entrypoint needs.
[PASS] Manifest integritySchema, tool names and parameter schemas are provider-compatible.
[PASS] Remote endpoint hygieneRemote servers speak TLS; handshake checks run in the dynamic stage.
[PASS] Supply chainNo install hooks, typosquats, unpinned dependencies or known vulnerabilities found.
[PASS] Sandbox behaviourNo dynamic findings. The runtime sandbox (DY-*) is not enabled yet.

Install

>synapth install rohitg00-awesome-claude-design-awesome-claude-design --target=claude-code

Or add to terminal

mkdir -p .claude/skills/rohitg00-awesome-claude-design-awesome-claude-design && cat > .claude/skills/rohitg00-awesome-claude-design-awesome-claude-design/SKILL.md <<'EOF'
---
name: Awesome Claude Design
description: Claude Design DESIGN.md prompts by aesthetic family, remix recipes, skills, video teardowns, X signal, honest community takes.
---
Claude Design DESIGN.md prompts by aesthetic family, remix recipes, skills, video teardowns, X signal, honest community takes.
EOF

Creates a project skill; Claude Code picks it up automatically.

Entry point

system prompt only

Permissions: none

Source repository

In skillsets

Not part of any skillset yet.

Assemble a skillset with it

Source repository

rohitg00/awesome-claude-design

Language: —
License: MIT
Forks: 147
Open issues: 6
Last push: 5mo ago
Manifest: README.md

ai-design anthropic awesome awesome-list claude-code claude-design claude-skills design-md

Skill logic

Awesome Claude Design

Preview Gallery

Contents

What Is Claude Design

Video Teardowns

Comparisons

More launch-week comparisons

Showcase

Community Takes

Hype

Pushback

The market

The fine print

Forum Pulse

Feature Map

Launch Timeline

Quotas & Token Budget

Official Resources

X Signal

DESIGN.md by Aesthetic Family

1. Editorial Minimalism

2. Terminal-Core

3. Warm Editorial

4. Data-Dense Pro

5. Cinematic Dark

6. Playful Color

7. Glass / Soft-Futurism

8. Neon Brutalist

9. Cult / Indie Picks (non-Fortune-500)