Claude Design 2.0 — Feature Demos

Quick Hits — Demos

New Claude Design interface & templates

Unified usage limits (Design + Code)

Generate a slide deck (Slides template)

Present mode + speaker notes

Export to PowerPoint (.pptx)

New manual Edit tool (edit elements directly)

Pro toggle — layered / Figma-style view

Markup tool (comment + draw feedback)

MCP connectors (Higgsfield image generation)

Design systems (animations + dashboard adhering)

Create a design system from Claude Code (/design sync)

/design sync example (Apple design system)

Send Design → Claude Code (share ▸ send to)

Jay E | RoboNuggets — the most-watched 2.0 walkthrough: slides, the rebuilt editor & /design sync · Open on YouTube →

AI LABS — mostly a conceptual explainer of the best Claude design skills (one hands-on build) · Open on YouTube →

Quick Hits — Demos

Access Claude Design in the desktop app (new terminal)

Interface tour (templates, projects, design systems, models)

Build slides from a GitHub repo + image (LaCroix deck)

Generated deck + editable speaker notes

Markup tool ('make this section bigger')

Canvas Edit feature (remove apostrophe inline)

Figma-style detail editing (fonts, colors)

Presentation mode (full screen)

Share & Export (HTML, PowerPoint)

Connectors: Firecrawl scrape brand → animation + image

Send design Claude Design → Claude Code (Level 4)

Paste handoff prompt into Claude Code → one-page site

Open Design — local, any-model alternative (Level 5)

Open Design: change site color green → blue

Jack Roberts — five levels of Claude Design 2.0, from the basics to Open Design · Open on YouTube →

Model Context Protocol

Give your AI the power to actually do things

Zapier MCP is a remote MCP server that plugs Claude, ChatGPT, Cursor and other AI clients into your real tools — the same connector several of these Claude Design demos rely on.

Zapier.com/MCP

Quick Hits — Demos

Two ways to access (web + desktop app tab)

New interface & templates tour

Unified token / usage limits

Design system from Claude Code (/design sync) — overview

/design sync walkthrough in the terminal

Build a landing page with the synced design system

Edit on the canvas (change pricing inline)

Comment → Send to Claude (remove a section)

Markup tool (point / draw, remove the @ sign)

Share & Export + Send to Claude Code + destinations

Add MCP connectors via Zapier (Canva / Figma)

Slides template example (generate a deck)

Present mode + speaker notes + full screen

Zubair Trabzada | AI Workshop — the most thorough feature-by-feature walkthrough · Open on YouTube →

Quick Hits — Demos

New Claude Design 2.0 interface & templates

Unified usage (pulls from your Claude plan)

Edit directly on the canvas (text: drag, add, change)

Edit elements (change a div's background color)

Design system from Claude Code (/design sync)

Imported design-system result (calorie app + animation)

Send design Claude Design → Claude Code

Turn the design into a functional app (import to Claude Code)

Add the Supabase connector (backend database)

Working app: add meals → data populates the database

Access Claude Design inside the desktop app

Connectors in Claude Design (browse directory)

Zapier MCP hack (9,000+ apps)

Generate an animation (compound-interest launch video)

Brock Mesarich | AI for Non Techies — turns a Design mockup into a working app with Supabase · Open on YouTube →

Claude Design 2.0 — the new features, demoed.

Give your AI the power to actually do things