Best Claude Design plugins and GitHub repos: what to install first

Searching for the best Claude Design plugins quickly drops you into three different worlds: Anthropic’s hosted design workspace, Claude Code plugins, and GitHub projects that may extend or replace both. I checked the official directories and the repositories themselves to build a stack you can actually use.

Choose your Claude Design stack in 30 seconds

If you came here with a deliverable due today, start with the path that matches the file you need to hand over. You can return to the deeper comparisons when a plan, permission, or quality question appears.

• Website or product UI: use Claude Design for direction, Figma for the approved visual state, Frontend Design and Claude Code for implementation, then Storybook, Playwright, and axe-core for review.
• Social campaign: use Claude Design for the master direction, Canva for template-based variants or Adobe for deeper finishing, then Cloudinary only if you need managed delivery at scale.
• Motion explainer: use Claude Design for the storyboard, HyperFrames or Remotion for editable motion, Runway for generated footage, and Adobe for the final timeline.
• Workshop or system map: use Claude Design for the first artifact and Miro for collaborative editing, comments, and decision records.
• Local-first workflow: test OpenDesign in a separate pilot. It is a platform choice, not a small plugin.
• One-off visual: stop at Claude Design if the export is correct and the reader does not need an editable source in another system.

The smallest useful stack has one exploration surface, one system of record, and one acceptance test. Add another connector only when it removes a measured handoff or owns a required file format.

Start here: Claude Design is not the plugin directory

Claude Design is Anthropic’s visual workspace. It can turn a brief into a prototype, deck, document, one-pager, wireframe, or marketing asset. You can comment on elements, edit text directly, move and resize objects, use generated controls for spacing and color, and bring in a design system.

A connector, skill, or plugin does something different. The terms matter because they tell you where the work runs, what it can touch, and where the bill or security risk sits.

The practical question is not, “Which Claude Design plugins should I install?” Ask, “What must remain editable, who approves the result, and which system should own the final file?” That answer determines the stack.

What Claude Design can do now

Anthropic launched Claude Design as a research preview on April 17, 2026. Its current product page now calls it a beta available on Pro, Max, Team, and Enterprise plans. It is included with those subscriptions and shares usage limits with Claude chat, Cowork, and Claude Code. Enterprise administrators must enable it because it is off by default.

The input and export surface has also grown. Claude Design can import from a codebase, web capture, DOCX, PPTX, and XLSX. A design system can come from GitHub, design files, or raw uploads. Claude can use the components, check its output against the system, and correct deviations. The current export list includes PDF, PPTX, HTML, an organization-scoped link, a Claude Code handoff, and connected destinations.

Anthropic names nine connected destinations: Adobe, Base44, Canva, Gamma, Lovable, Miro, Replit, Vercel, and Wix. That list is useful, but it does not mean nine equivalent plugins are installed inside Claude Design.

• Editable creative work: send a campaign draft to Adobe or Canva for production editing and brand operations.
• Decks and collaboration: move a presentation into Gamma or a concept into Miro for team review.
• Apps and websites: move a prototype toward Base44, Lovable, Replit, Vercel, or Wix when the next job is implementation or deployment.
• Code handoff: use Claude Code when the deliverable should live in a repository and pass real tests.

Claude Design is therefore the exploration and translation layer. Your destination remains the system of record.

The most popular Claude design plugins

Anthropic’s official directory publishes install counts. They are the cleanest public popularity signal available, but they are not a quality ranking. An older general-purpose plugin will naturally have more installations than a specialist tool that launched recently. Counts below are a September 3, 2026 snapshot and will change.

The most popular Claude Design repositories on GitHub

GitHub adds useful options, but it also creates the easiest category mistake in this guide. Most repositories below do not install into the hosted Claude Design beta at claude.ai. They target Claude Code, package portable Agent Skills, connect another design surface, or offer a separate local application.

I filtered for repositories that are directly useful to a design workflow, then checked the GitHub API for stars, maintenance activity, license data, and repository status. Stars show attention, not safety or output quality. The count is a September 3, 2026 snapshot.

Start with Anthropic’s two official repositories

anthropics/skills is the best place to learn how an Agent Skill is structured. It includes creative and design examples, but Anthropic explicitly describes the repository as educational and tells users to test skills before relying on them. Its licensing is mixed: many skills use Apache 2.0, while the document skills have separate source-available terms. Check the file you plan to reuse instead of assuming the repository has one license.

claude-plugins-official is the marketplace source. It separates Anthropic-maintained plugins from external packages and exposes the actual plugin structure: manifest, optional MCP configuration, commands, agents, and skills. That makes it a better starting point for installation and source review than a copied command in a social post.

UI UX Pro Max chooses a system; Impeccable critiques the result

These two large community repositories solve different problems. UI UX Pro Max is a retrieval and recommendation layer. Its current repository documents 79 searchable styles, 192 product-specific palettes, 74 font pairings, 119 UX guidelines, and support for 22 implementation stacks. Use it early to turn a product type and brief into a concrete design system. Those figures come from the maintainer’s repository and describe the package, not independently measured design quality.

Impeccable is stronger later in the loop. Its current release provides one skill, 23 commands, live browser iteration, and 61 deterministic detector rules. Commands such as shape, critique, audit, polish, animate, and harden give a team a shared review vocabulary. I would not stack both tools blindly. Let UI UX Pro Max propose the system, then let Impeccable inspect a rendered implementation against project truth.

OpenDesign is an alternative workspace, not an extra prompt

OpenDesign is the biggest project here that tries to reproduce the artifact-first workflow outside Anthropic’s hosted product. Its repository documents a local-first desktop app, reusable DESIGN.md systems, live previews, HTML, PDF, PPTX, and MP4 exports, plus support for Claude Code and other coding agents. It can also use HyperFrames for code-driven motion.

That breadth is useful, but it changes the risk calculation. You are adopting a desktop application, local services, model credentials, export code, and a large plugin surface. Treat it like a development platform: review its Apache 2.0 source, verify the release you download, use a test workspace, inspect outbound connections, and keep sensitive design systems out of the first evaluation.

Remotion is the strongest GitHub route for editable motion

HyperFrames remains a useful Claude plugin, but Remotion’s official Agent Skills give developers a broader code-first video route. The package covers project creation, React markup, Studio preview, rendering, captions, maps, interactive editing, and product architecture. Install the maintained skills with npx skills add remotion-dev/skills.

Choose this route for explainers, data videos, product walkthroughs, captions, or motion systems that must survive revision. Generated cinematic footage still belongs in Runway or another video model. Remotion owns the composition and render logic.

Figma’s guide is the bridge I would trust first

The official Figma MCP guide is smaller because it is documentation, not a viral skill collection. It is still the more important source for a production Figma workflow. Figma documents design-context extraction, Code Connect, code generation, web-page capture, and native canvas writing. The recommended Claude Code installation is claude plugin install figma@claude-plugins-official.

Figma says write-to-canvas is free during beta and is expected to become usage-based. That is exactly the kind of plan boundary a community tutorial can miss. Read the official guide before installing a third-party bridge that asks for a personal access token or local plugin control.

Use curated lists for discovery, not installation authority

The Claude Code Frontend Design Toolkit is a useful map of design skills, Figma tooling, animation libraries, browser testing, documentation, and deployment. It also shows why lists age quickly: star counts, commands, pricing, and tool ownership can change after the list is published.

Click through to the source repository, read the current README and manifest, inspect recent releases and open security issues, then install a pinned version when the workflow matters. I excluded smaller repositories that mainly copy or compress another project’s instructions without adding a maintained tool, test method, or distinct workflow. A familiar Claude Design name is not enough.

The production resources that make Claude’s design usable

The resources below are not hosted Claude Design plugins. They become useful after a visual direction turns into components, motion code, or a file another person must maintain. That distinction keeps the guide honest and makes the stack easier to debug.

Storybook gives Claude the states a screenshot hides

Storybook renders components and pages in isolation, so empty, loading, error, disabled, overflow, and responsive states can exist as named evidence. Its official Storybook MCP repository includes a Claude Code plugin that exposes component knowledge and setup workflows to the agent.

The repository is experimental and active, so pin the version and test it in a non-critical project. Its documented Claude Code setup is claude plugin marketplace add storybookjs/mcp@main --scope user, followed by claude plugin install storybook@storybook --scope user. I would use project scope when a team needs a reproducible version instead of inheriting a changing user-wide tool.

Vercel’s skills add the review pass most design prompts forget

vercel-labs/agent-skills is an official collection for coding agents. The design-relevant pieces include web interface guidelines, React and Next.js performance rules, composition patterns, and view transitions. The repository had 30,779 GitHub stars when checked on September 3, 2026. Install the collection with npx skills add vercel-labs/agent-skills, then use only the skills the project needs.

The smaller web-interface-guidelines repository is easier to audit directly. It covers keyboard operation, focus, forms, responsive layout, animation, images, dark mode, touch behavior, and performance. I would run that review after Impeccable’s visual critique. Taste comes first; measurable interface behavior comes next.

Playwright and axe-core turn approval into a repeatable test

Playwright can test the same interface in Chromium, Firefox, and WebKit. It can capture screenshots, exercise keyboard flows, verify responsive behavior, and compare visible states. Microsoft now documents Playwright Test, an agent-oriented CLI, and Playwright MCP as separate routes. Choose the test runner for CI evidence; choose MCP when the agent needs supervised browser access during development.

axe-core adds automated accessibility checks to the same test environment. It cannot prove that a workflow is usable, and a clean automated scan is not WCAG conformance. Pair it with keyboard testing and a human review against WCAG 2.2 and the ARIA Authoring Practices Guide.

Use a real component system instead of asking for a vague style

shadcn/ui gives Claude readable component source that your team owns and can change. Radix Primitives supplies lower-level behavior for dialogs, menus, tooltips, and other interactive controls. Neither is a substitute for your product’s visual system, but both are better implementation constraints than “make it modern.”

If an established system already fits the product, point Claude to that system’s current documentation. Material Design 3 is useful for Google-style product patterns, Carbon for enterprise interfaces, and Shopify Polaris for Shopify apps. Pick one. Mixing three systems usually leaves you with incompatible spacing, states, language, and component behavior.

Motion and GSAP belong in the implementation brief

For interface motion, use the official Motion documentation or GSAP documentation as the implementation source. Tell Claude which library is already installed, what triggers the animation, how it should interrupt, and what happens when the user prefers reduced motion. A motion reference without those constraints is decoration, not a behavior specification.

My rule for this entire resource layer is simple: one design system, one component source, one browser test runner. Add a second library only when the first one cannot express a named requirement.

Best plugins for UI, websites, and product design

Frontend Design: the default choice for coded interfaces

Frontend Design is the clear popularity leader and is made by Anthropic. It is a Claude Code plugin, not a visual editor. Its job is to establish a design direction before coding, then apply typography, color, spatial composition, depth, motion, and scroll interactions without falling back to the same generic components.

Use it after the product direction and component rules are settled. Do not use it as a substitute for interaction design, content requirements, accessibility acceptance, or a visual regression test. A polished first render can still contain the wrong states and breakpoints.

Figma: the strongest design-to-code bridge

The Figma plugin lets Claude Code access layouts, typography, colors, variables, tokens, components, and visual references. It can map Figma components to code through Code Connect, generate design-system rules, and translate selected frames into code. The separate Figma connector also supports a two-way flow between production screens and editable Figma layers.

This is the right choice when a designer and developer must inspect the same source of truth. It is overkill when the final job is a simple social post. It is under-governed when the prompt can change tokens or components without a design owner reviewing the diff.

Playground: the fast way to expose design choices

Playground creates a self-contained HTML file with visual controls, presets, a live preview, and a prompt you can copy. Its design template is useful when stakeholders cannot react to abstract adjectives such as “premium” or “playful.” Give them controls for density, radius, contrast, type scale, or card treatment and record the accepted settings.

The artifact is an explorer, not the product. Once the choice is accepted, translate it into design tokens and tests rather than carrying a one-off HTML control panel into production.

Best plugins for brand and campaign production

Canva: best for repeatable campaign variants

The Canva plugin bundles six specialist skills. It can edit a design through a preview-and-approve transaction, resize for major social formats, bulk-create designs from spreadsheet data, check a brand kit, critique hierarchy and accessibility, and implement design feedback from comments. The bulk-create skill requires Canva Enterprise.

That makes Canva the practical choice for a marketing team with approved templates and repeated variants. Use direct Claude Design export for one artifact. Use the Canva connector and plugin when Claude must search, populate, review, resize, and update Canva work repeatedly. Our Canva AI 2.0 workflow test shows how to check editable layers, brand drift, and repair time before migrating a campaign.

Adobe for creativity: best for finishing across media

Adobe for creativity is an Anthropic Verified Cowork plugin made by Adobe. It covers images, vectors, design, and video. Anthropic lists headshot refinement, on-brand social content, cross-platform variations, batch photo editing, video resizing, and Quick Cut highlight reels among its workflows.

The related Adobe connector reaches the broader Creative Cloud surface, including Photoshop, Illustrator, Lightroom, Firefly, Premiere, Express, InDesign, and Stock. The plugin is the packaged workflow; the connector is the access layer. An Adobe account can unlock saved work and higher limits, and licensing Stock or using paid Adobe features can create a second bill.

If Adobe Express is already your final editor, compare the Claude route with our Adobe Express AI Assistant review. The right assistant is the one that preserves your editable file, not the one that produces the flashiest preview.

Miro: best for alignment before production

Miro is not a finishing tool. Its plugin can browse a board, create diagrams, write documents and tables, extract a board into implementation specs, and turn a pull request into a visual review. Use it between research and production when a team needs to agree on the flow, architecture, storyboard, or campaign map.

Best Claude plugins for motion and video

HyperFrames: code-first motion graphics

HyperFrames by HeyGen turns HTML into video. Its plugin supports compositions, GSAP and runtime animations, captions, voiceovers, audio-reactive visuals, and website capture. The connector page describes animated slides, explainer videos, motion graphics, and MP4 rendering. Because the core is open source and code-first, it is well suited to charts, kinetic typography, product explainers, and repeatable data-driven video.

Choose HyperFrames when motion follows a layout system and must be revised like code. Do not choose it for photorealistic generative footage. Voice, avatar, media, and hosting services used around the open-source core may still cost money.

Runway API: generated footage at production scale

The Runway API plugin is for generated video, image, and audio workflows. Anthropic lists batch ad campaigns, product videos, multishot stories, and creative iteration. Runway’s official developer pricing is usage-based at $0.01 per credit, with a $10 minimum credit purchase to start using the API. Model and resolution choices can change the realized cost substantially.

Choose Runway when the missing asset is footage. Give it an approved shot list, duration cap, model choice, resolution, retry limit, and maximum credit budget. A prompt without a budget is not a production brief.

Adobe: final cut, resizing, and multi-format delivery

Use Adobe after generation when the job needs a human-editable timeline, exact crops, licensed assets, color work, audio cleanup, captions, or channel exports. HyperFrames and Runway create different kinds of raw material. Adobe is the stronger finishing lane.

Cloudinary is the missing asset-operations layer

Many creative stacks stop at export. The Cloudinary plugin handles what happens after approval: upload, organization, metadata, image and video analysis, transformations, optimization, and delivery. It can construct transformation URLs for crops, formats, quality, background removal, generative fill, overlays, and video trimming.

Use it when the same approved asset must become dozens of delivery variants or when your product needs a managed media pipeline. Do not give it the role of creative director. Its value is reliable asset operations.

Free versus paid: the two-bill problem

A plugin can be free to install and still require two paid systems. Anthropic says plugins are available on paid Claude plans, not Claude Free. Claude Pro is $20 per month or $200 per year. Max 5x is $100 per month and Max 20x is $200 per month. Team and Enterprise pricing follows organization terms.

The second bill comes from the connected service, API credits, stock licensing, storage, or seats. Treat “free plugin” as “no separate plugin purchase listed,” not “zero-cost workflow.”

The GitHub layer follows the same rule. UI UX Pro Max, Impeccable, and OpenDesign publish reusable source under permissive licenses, but running them can still require Claude access, model API usage, local compute, rendering, or paid connected services. Remotion’s skills cost nothing to inspect; video rendering and hosting still consume machines and time. Open source changes access to the code. It does not make the production workflow free.

A practical starter stack is Claude Pro plus Frontend Design and Playground for interface exploration. Add one provider only when a deliverable requires it. Figma is the product-design route, Canva the campaign route, Miro the collaboration route, HyperFrames the motion route, and Cloudinary the delivery route.

Creative connectors beyond the plugin shortlist

Anthropic’s creative-work release also names specialist connectors that do not all appear as popular one-click plugins. They extend Claude into 3D, audio, and live visuals.

• Blender: use Claude with Blender’s Python API for scene construction, modeling automation, and repetitive 3D tasks.
• Autodesk Fusion: move from requirements and measurements toward CAD and product-design work.
• SketchUp: support spatial modeling and architectural concept workflows.
• Resolume: control and organize live-visual performance work.
• Splice: search and work with music samples.
• Ableton documentation: ground production questions in official Ableton material. A documentation connector is knowledge access, not automatic control of the application.
• Affinity: route visual editing into a specialist creative suite.

Check the current connector page before promising a workflow. “Works with Claude” can mean read-only documentation, interactive app control, generated code, or a handoff into another application. Those are four different capabilities.

Three advanced Claude Design stacks

1. Product interface from brief to production

1. Import approved components and tokens into Claude Design.
2. Create two interaction directions and test the prototype with real users.
3. Send the accepted direction to Figma for editable layers, comments, and design-system review.
4. Use the Figma and Frontend Design plugins in Claude Code to implement the approved states.
5. Deploy a preview through Vercel or the team’s normal environment.
6. Run accessibility, breakpoint, state, and visual-regression checks before merge.

The acceptance artifact is not the screenshot. It is the combination of approved Figma state, code diff, automated checks, and reviewer sign-off.

2. Brand campaign from concept to channel variants

1. Load the brand system and campaign brief into Claude Design.
2. Approve one master direction, message hierarchy, and image treatment.
3. Send the design to Canva for template-driven variants or Adobe for deeper production editing.
4. Run a brand-check skill against every output, not only the master.
5. Use Cloudinary for approved crops, formats, metadata, and delivery URLs.
6. Keep publishing behind a human approval gate.

If you are still choosing the production editor, our Google Pics, Canva, and Adobe Express comparison starts with editability, templates, data, and workflow ownership.

3. Motion explainer with generated footage

1. Build the storyboard, shot purpose, narration, and visual rules in Claude Design.
2. Use HyperFrames for charts, UI sequences, kinetic type, and repeatable motion graphics.
3. Use Runway only for shots that require generated footage or image animation.
4. Finish timing, audio, captions, color, and channel crops in Adobe.
5. Store and deliver approved versions through Cloudinary.
6. Record the source, model, prompt, rights status, and human approval for every generated shot.

This stack avoids paying a video model to generate things HTML motion can render more predictably. It also keeps generated footage separate from typography, data, and interface animation.

How to install plugins and GitHub skills safely

In Claude on the web or desktop, open Customize, choose Plugins, select Browse plugins, and install the package you trust. The skills inside an installed plugin can work in web chat, Claude Desktop Chat, and Cowork. Hooks and sub-agents run only in Cowork, so ordinary chat may expose fewer capabilities.

In Claude Code, run /plugin and open the Discover tab. The official marketplace is available by default. A direct install uses /plugin install plugin-name@claude-plugins-official. If a plugin is missing, refresh the marketplace before adding an unknown repository.

Install scope matters in Claude Code. User scope follows you across projects. Project scope is shared through repository settings. Local scope applies only to you in one repository. Put a team-required creative workflow at project or managed organization scope only after its permissions and output contract are reviewed.

For a GitHub skill or marketplace, add one source at a time. Record the repository URL, commit or release, license, install command, files created, MCP servers added, and credentials requested. Review any shell scripts before they run. A Markdown-only skill changes model behavior; an MCP server or hook can execute with local permissions. Those are different security classes.

Build a custom design plugin when your rules are the product

A custom plugin becomes worthwhile when your competitive advantage is not access to Canva or Figma but the way your team turns a brief into accepted work. Package the method, not every app you own.

• Brief contract: required audience, job, channel, dimensions, source material, and finish line.
• Brand skill: approved tokens, typography, logo rules, accessibility thresholds, and prohibited treatments.
• Connector allowlist: only the services and scopes needed for the job.
• Output contract: file format, layer naming, dimensions, metadata, editable elements, and export folder.
• Approval gate: a person approves publishing, purchasing, licensing, destructive edits, and external sharing.
• Evidence record: save source files, prompt, model, plugin version, connector actions, costs, and reviewer decision.
• Failure rule: stop when a required source, right, credential, or approval is missing.

Anthropic provides a Plugin Create workflow and file-based plugin templates. Start from the smallest auditable package. A skill plus one connector is easier to review than a bundle with broad local MCP access, several sub-agents, and automatic publishing.

For repository-based work, keep the operating record too. Our guide to Claude Code local session transcripts explains what the transcript can preserve and what a compliance or review workflow still has to add.

Four copy-and-fill briefs for Claude Design

These templates are deliberately plain. Replace the bracketed fields, attach the real source files, and remove any line that does not apply. The goal is a testable handoff, not a longer prompt.

Goal: [the decision or artifact this design must support]
Audience: [primary user and context]
System of record: [Figma, repository, Canva, Adobe, or other]
Approved source: [link or attached design-system files]
Tokens to preserve: [color, type, spacing, radius, motion]
Components to reuse: [named components and variants]
Required states: [empty, loading, error, success, disabled]
Breakpoints: [exact widths]
Content source: [approved copy and data]
Must remain editable: [layers, text, data, timeline, code]
Do not change: [legal copy, logos, tokens, interactions]
Acceptance test: [who reviews what and where]

Read the selected Figma frame and its component references.
Map each visible element to an existing component before writing code.
List unmatched components, missing states, and ambiguous tokens first.
Do not invent a new component when an approved equivalent exists.
Implement the accepted frame at [breakpoints].
Create stories for default, loading, empty, error, and long-content states.
Return the changed files, unresolved visual differences, and test evidence.
Do not publish or merge without [reviewer] approval.

Review [URL or component] at 390, 768, 1024, and 1440 pixels.
Test keyboard order, visible focus, labels, errors, and escape behavior.
Check 200 percent zoom, long text, empty data, and reduced motion.
Run axe-core and report automated findings separately from manual checks.
Use WCAG 2.2 and ARIA APG references for each proposed fix.
Do not change the visual system unless a defect requires it.
Return screenshots, failing states, fixes, and remaining human checks.

Deliverable: [explainer, product demo, ad, or social video]
Duration and frame rate: [seconds and fps]
Aspect ratios: [16:9, 9:16, 1:1, or named outputs]
Storyboard source: [approved frames or script]
Editable motion layer: [Remotion, HyperFrames, GSAP, or Motion]
Generated footage: [allowed shots, model, resolution, retry limit]
Audio and captions: [source, language, timing, rights]
Brand rules: [type, color, logo, transitions, prohibited effects]
Reduced-motion or static alternative: [required behavior]
Credit budget: [maximum provider spend]
Acceptance evidence: [frame captures, render, reviewer, source log]

Security and rights checklist

A creative connector may be able to read private brand files, create assets, change existing work, upload media, spend credits, license stock, or publish externally. A design brief without a permission map is incomplete.

• List the exact read, create, edit, export, publish, purchase, and delete scopes.
• Use a test workspace and non-sensitive assets for the first run.
• Separate source files, working files, and approved exports.
• Confirm who owns uploaded inputs and generated outputs under each provider’s current terms.
• Require approval before stock licensing, credit purchases, public sharing, or destructive edits.
• Record which plugin, connector, model, and source files produced the accepted result.
• Test revocation and file restoration before a production incident.
• Review local MCP software separately because it can run with normal program permissions.
• Prefer Anthropic Verified packages where available, but still inspect the source, permissions, and provider.

Community directory inclusion is not a guarantee of safety or quality. Anthropic says community plugins receive basic automated review, while Anthropic Verified entries get additional review. The official documentation still tells users to install only trusted sources.

The six-brief test before you standardize

1. Brand brief: create two directions from the same approved system and count visible deviations.
2. Editability brief: ask a second person to change copy, imagery, spacing, and format without rebuilding the artifact.
3. Product brief: move one component from design to code and compare every state with the approval source.
4. Motion brief: build a 20-second explainer with captions and record generation, render, repair, and export time.
5. Repetition brief: rerun the workflow in a fresh session using the installed skill or plugin.
6. Revocation brief: remove connector access and confirm that the workflow fails safely.

Track time to first editable artifact, review minutes, repair minutes, brand deviations, broken handoffs, failed exports, external write actions, and provider credits. Two calculations reveal most bad stacks:

Net workflow time saved = manual handoff minutes removed minus setup, review, repair, and permission-maintenance minutes.

Accepted-output cost = Claude allocation, provider credits, review labor, and repair labor divided by approved deliverables.

The second number prevents cheap generations from hiding expensive cleanup. Ten $1 attempts that produce one accepted asset are not a $1 workflow.

My recommended Claude Design stacks

• Solo founder: Claude Design plus one destination. Choose Canva for fast campaign editing, Figma for product UI, or Vercel for a coded prototype.
• Product team: Claude Design, Figma, Frontend Design, Claude Code, preview deployment, and automated visual checks.
• Marketing team: Claude Design, Canva or Adobe, a brand-check skill, approval workflow, and Cloudinary only if asset volume justifies it.
• Motion team: Claude Design for storyboards, HyperFrames for deterministic motion, Runway for generated footage, and Adobe for finishing.
• Enterprise: an approved design system, organization-managed plugins, least-privilege connectors, usage reporting, and a human publishing gate.

Do not install the whole directory. Every extra connector creates another place for credentials, rights, costs, and file ownership to become unclear.

My verdict

Claude Design is most valuable as the place where a brief becomes an editable direction. Frontend Design and Figma are the strongest official extensions for interfaces. UI UX Pro Max can make the initial system less generic, while Impeccable is the sharper review layer. Canva and Adobe are the practical production routes for campaigns. HyperFrames and Remotion solve code-first motion; Runway supplies generated footage. Cloudinary earns its place only when approved media must be transformed and delivered at scale.

If I were starting today, I would use Anthropic’s Frontend Design plus the official Figma plugin for product work. I would add UI UX Pro Max only when the project lacks a design system, Impeccable when the team needs a repeatable critique and polish pass, and Remotion when the output is video. OpenDesign deserves a separate pilot if local-first control matters. It should not enter the stack by accident.

Primary sources and live directories

• Review the current Claude Design product page, plan coverage, imports, exports, and connected destinations.
• Browse Anthropic’s live Claude plugin directory.
• Read Anthropic’s plugin availability, installation, and security guidance.
• Check the official Claude Code plugin marketplace instructions.
• Compare the official Figma, Canva, Adobe, Miro, and HyperFrames connector pages.
• Verify current provider costs on the official Figma, Canva, Miro, Adobe Express, Cloudinary, and Runway API pricing pages.
• Use WCAG 2.2 and the ARIA Authoring Practices Guide as testable accessibility references.
• Keep production evidence in Storybook, Playwright, and axe-core.

For open repositories, inspect Anthropic’s Agent Skills, the official Claude plugin marketplace source, UI UX Pro Max, Impeccable, OpenDesign, Remotion Agent Skills, the Figma MCP guide, Vercel Agent Skills, and the experimental Storybook MCP plugin.

Which handoff in your current design workflow creates the most repair work after Claude finishes?