> ## Documentation Index
> Fetch the complete documentation index at: https://magicpatterns.mintlify.site/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Inline Comments

> Leave feedback directly on specific elements in a design

Inline comments let you leave feedback directly on specific elements in a design. This makes reviews faster, clearer, and easier to track across teammates and iterations.

<Frame>
  <img src="https://mintcdn.com/magicpatterns/r7WxSEN_k7EK12_1/documentation/collaboration/images/comments-full-sidebar.png?fit=max&auto=format&n=r7WxSEN_k7EK12_1&q=85&s=ed02512e5655ad070bf7238660dbae95" width="1332" height="686" data-path="documentation/collaboration/images/comments-full-sidebar.png" />
</Frame>

## Get your share link

To collect feedback, start by clicking on the Share button in the editor navbar.

<Steps>
  <Step title="Open Share">In the editor, click the Share button.</Step>

  <Step title="Copy the Link">
    <Frame>
      <img src="https://cdn.magicpatterns.com/uploads/hLz5mzwxDWRcge45n1sdQz/share-panel.png" />
    </Frame>
  </Step>

  <Step title="Send it to your teammates">
    Anyone with the preview link can view the design and leave comments (if they
    have access).
  </Step>
</Steps>

## Enter Comment Mode

### From the editor

* Click the **comment** icon in the editor navbar to toggle Comment Mode.

<Frame>
  <img src="https://mintcdn.com/magicpatterns/r7WxSEN_k7EK12_1/documentation/collaboration/images/editor-room-comment-mode-button.png?fit=max&auto=format&n=r7WxSEN_k7EK12_1&q=85&s=4f0392593c64f7857fb056e2e7e6997d" width="588" height="264" data-path="documentation/collaboration/images/editor-room-comment-mode-button.png" />
</Frame>

### From the share link

* Open the preview link and click the **comment** icon to toggle Comment Mode.

<Frame>
  <img src="https://mintcdn.com/magicpatterns/r7WxSEN_k7EK12_1/documentation/collaboration/images/preview-link-comment-mode-button.png?fit=max&auto=format&n=r7WxSEN_k7EK12_1&q=85&s=2db7ee8a07ac32fa795578d15f67d755" width="694" height="250" data-path="documentation/collaboration/images/preview-link-comment-mode-button.png" />
</Frame>

<Tip>
  You can quickly toggle Comment Mode with <strong>C</strong>. You can also
  hide/show comment indicators with <strong>H</strong>.
</Tip>

## Add an inline comment

Once Comment Mode is enabled:

<Steps>
  <Step title="Click an element in the design">
    Tap on the specific UI element you want to comment on.
  </Step>

  <Step title="Write your feedback">
    Add context, describe the issue, and include a suggestion if you can.
  </Step>

  <Step title="Post the comment">
    Your comment appears as an indicator on the design and in the comments
    panel.
  </Step>
</Steps>

<Note>
  Comments are <strong>tied to elements</strong> in the design. If you resize
  the screen and elements move, your comments stay anchored to the right
  elements.
</Note>

<Frame>
  <img src="https://mintcdn.com/magicpatterns/r7WxSEN_k7EK12_1/documentation/collaboration/images/adding-new-comment.png?fit=max&auto=format&n=r7WxSEN_k7EK12_1&q=85&s=c3a59016214210d6afb126ad4a05e3ad" width="699" height="535" data-path="documentation/collaboration/images/adding-new-comment.png" />
</Frame>

## Commmon workflows:

* Async design reviews: Share a preview link, ask reviewers to leave comments directly on the relevant UI, and iterate without long meetings.
* Collecting feedback: Product, engineering, and stakeholders can comment on exactly what they mean—even if they're not editing the design.
* Bug or polish tracking: Use comments as a lightweight checklist while you refine the UI (resolve items as you address them).
* Version-aware feedback: Comments can be grouped by design version, so you can understand what feedback applies to which iteration.

## Troubleshooting

<Warning>
  If you don't see comment indicators in the editor, make sure **comment mode**
  is active (toggle it in the toolbar).
</Warning>

## Video Guide

This topic is covered in our video lesson [Team Workflows and Sharing](/documentation/guide/team-workflows-and-sharing).

<iframe className="w-full aspect-video" src="https://www.youtube.com/embed/KMd_1dNQLeI?si=9xAlg5KBE941_5sP" title="Team Workflows and Sharing" alt="Team Workflows and Sharing" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />