aiux
PatternsPatternsNewsNewsAuditAuditResourcesResources
Overview

Setup

  • What Claude Design Is (and Isn't)
  • Your First Prompt: The Four-Part Framework
  • Importing Assets: Screenshots, Docs, and Codebases

Iteration

  • Iterating via Conversation
  • Inline Comments and Direct Edits
  • Tweaks: Explore Variations Without Chat

Design-system

  • Extracting Your Design System
  • Publishing and Applying Your Design System
  • Team & Enterprise Setup

Workflows

  • Prompt to Interactive Prototype
  • Prompt to Pitch Deck
  • Handoff to Claude Code for Implementation
  1. Guides
  2. /
  3. Claude Design Guide for Designers
  4. /
  5. Inline Comments and Direct Edits
iterationLesson 5 of 12

Inline Comments and Direct Edits

2 min readClaude Design for DesignersUpdated Apr 21, 2026

When you need to change one specific element, this button, that heading, this spacing, chat is the wrong tool. Inline comments let you click anywhere on the canvas and describe a targeted change. Claude changes only what you pointed at.

How to leave an inline comment

1

Click the element

Click directly on the component you want to change, a button, a card, a headline.

2

Describe the change

Type the specific request. 'Make this button bigger and change the label to Start for free.'

3

Submit

Claude makes the targeted change without touching the rest of the canvas.

Claude Design with Comment mode active. A kanban card on the Lineup board is selected; a popover opens anchored to it with "Rename this card to Launch hero + pricing" typed inside; clicking Send to Claude queues the change as a pending chip in the chat panel
Steps 1–3 in action. The request queues in the chat panel after Send.

What inline comments are best for

  • Component-level refinements (button styles, card borders)
  • Spacing adjustments (gap between items, padding inside a section)
  • Element type changes (swap a dropdown for a radio group)
  • Specific copy edits (headline wording, CTA label)
Known quirk

Anthropic has documented that comments can occasionally fail to trigger, the comment queues and sends, but the canvas doesn't update, or the comment disappears on reload. When that happens, paste the same request into chat as a follow-up and Claude executes it there. Same result, different path.

Follow-up after an inline comment that didn't trigger. The same rename request is pasted into the chat panel as a regular message. Claude processes it, refreshes the canvas, and the target card now reads 'Launch hero + pricing'
Chat fallback. Same request, Claude applies it and the canvas refreshes.

Direct canvas edits

You can also edit text directly on the canvas, click a heading, change the words, press Enter. This is faster than describing the change in a comment for simple copy edits. Claude picks up the edit and preserves the design around it.

Hands-on perspectives
  • How To Use Claude Design: The Non-Designer's Walkthrough· Medium

    Cursor-style element selection explained: click, edit, watch it update live.

  • Claude Design Review: I Spent a Day With It· Medium (Pen With Paper)

    Honest account of using all four iteration channels in a real project.

You can target specific elements

  • Can drop an inline comment on any element
  • Know which changes belong as comments vs. chat
  • Can direct-edit text on the canvas

Next: custom sliders, a trick that makes design exploration actually fast.

← Previous LessonIterating via ConversationNext Lesson →Tweaks: Explore Variations Without Chat
← Back to Claude Design Guide for Designers overview

On this page

  • How to leave an inline comment
  • What inline comments are best for
  • Direct canvas edits

aiux

AI UX patterns from shipped products. Demos, code, and real examples.

Have an idea? Share feedback

Get daily AI UX news

Resources

  • All Patterns
  • Browse Categories
  • Contribute
  • AI Interaction Toolkit
  • AI UX Audit
  • Agent Readability Audit
  • Newsletter
  • Documentation
  • Figma Make Prompts
  • Designer Guides
  • All Resources →

Company

  • About Us
  • Privacy Policy
  • Terms of Service
  • Contact

Links

  • Portfolio
  • GitHub
  • LinkedIn
  • More Resources

Copyright © 2026 All Rights Reserved.