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

# Collaboration

export const MessageCircleIcon = props => {
  return <div style={{
    display: "inline",
    justifyContent: "center",
    alignItems: "center"
  }}>
      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true" style={{
    display: "inline"
  }} {...props}>
        <path d="M7.9 20A9 9 0 1 0 4 16.1L2 22Z"></path>
      </svg>
    </div>;
};

export const ShareIcon = props => {
  return <div style={{
    display: "inline",
    justifyContent: "center",
    alignItems: "center"
  }}>
      <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true" style={{
    display: "inline"
  }} {...props}>
        <circle cx="18" cy="5" r="3"></circle>
        <circle cx="6" cy="12" r="3"></circle>
        <circle cx="18" cy="19" r="3"></circle>
        <line x1="8.59" x2="15.42" y1="13.51" y2="17.49"></line>
        <line x1="15.41" x2="8.59" y1="6.51" y2="10.49"></line>
      </svg>
    </div>;
};

Design Mode stores all of its artifacts as files: [Canvases](./canvas) live as `.canvas` files inside the `.kombai/canvas/` folder at the root of your project, and [Design Systems](./design-system/overview) live as `.ds` files in your user-wide Kombai library. Because Canvases are files in your project, you can collaborate on designs using the same tools and workflows you already use for code.

To quickly access sharing options, click the <ShareIcon /> icon in the [Canvas zoom bar](./canvas#zoom-bar) to open the **Collaborate on design** modal. The modal features tabs (**Entire Canvas**, **Design**, and **Design System**), each with specific sharing instructions.

## Comments

Use comments to leave feedback, ask questions, or add notes directly to your designs. Click the <MessageCircleIcon /> icon in the [Canvas bottom toolbar](./canvas#bottom-toolbar) to activate the comment tool, then click anywhere on a design to place a comment.

Comments are useful for:

* **Leaving design feedback**: Point out specific elements that need changes, suggest improvements, or approve sections.
* **Adding context for teammates**: Explain design decisions or flag areas that need attention before code generation.
* **Personal notes**: Bookmark parts of a design you want to revisit or iterate on later.

## Git as a collaboration system

Because every Canvas is a file on your disk, your existing Git workflow doubles as a design collaboration system. When you commit and push your `.kombai/` folder, your entire team gets access to the same Canvases.

<Note>Design Systems are stored in your user-wide Kombai library (`~/.kombai/design-systems/`), not in the project, so they are not shared by committing the `.kombai/` folder. See [Sharing Design Systems](#sharing-design-systems) below for how to share them.</Note>

### Recommended workflow

1. **Create a branch** for your design work, just like you would for a feature.
2. **Design on the Canvas** as you go.
3. **Commit and push** the `.kombai/` folder changes (including `.canvas` files in `.kombai/canvas/`).
4. **Open a pull request** so your team can review the design files alongside any code changes.
5. **Merge to main** once approved, making the designs available to everyone.

This keeps your design artifacts in sync with your codebase and gives you the full benefits of Git—branching, history, diffs, and code reviews—for your design work.

## Sharing individual artifacts

Since all Design Mode artifacts live as files on disk, you can share specific files directly with a teammate without going through a full Git workflow. This is especially useful for quick, informal collaboration.

### Sharing an entire Canvas

**Via Git:**
Commit your `.canvas` file from `.kombai/canvas/` to your repository. Anyone on your team who pulls the repository will have access to the Canvas, including all designs stored within it.

**Manually:**

1. Locate your Canvas file inside `.kombai/canvas/`.
2. Send the `.canvas` file to your teammate through any channel (e.g., Slack, email, or a shared drive).
3. Your teammate saves the file under `.kombai/canvas/` in their local project.
4. They can now open and use the shared Canvas in their Design Mode session.

<Note>**Important:** Sharing a Canvas does not include Design Systems. Design Systems are stored separately and must be shared using the steps in the Design Systems section below.</Note>

### Sharing individual designs

Designs live inside your Canvas. To share them, you need to share the Canvas they belong to:

1. **Share the entire Canvas**: Follow the steps in the [Sharing an entire Canvas](#sharing-an-entire-canvas) section above.
2. **Share only select designs**: Copy the specific designs to a new Canvas first. Then, share that new Canvas using the steps in the [Sharing an entire Canvas](#sharing-an-entire-canvas) section.

### Sharing Design Systems

Design Systems live in your user-wide Kombai library at `~/.kombai/design-systems/`, so they can't be shared by committing project files. Instead:

1. Locate the `.ds` file for your Design System inside `~/.kombai/design-systems/`.
2. Send the file to your teammate through any channel (e.g., Slack, email, or a shared drive).
3. Your teammate saves the file under `~/.kombai/design-systems/` in their own library — or anywhere inside their project, where Kombai will discover it automatically.
4. They can now use the shared Design System in their Design Mode session.

## Sharing examples

* **Two designers collaborating on a page**: One person designs the hero section and commits the `.canvas` file to a branch. The other person pulls the branch, opens the Canvas, adds the features section, and commits the updated file back.
* **Sharing a Design System across projects**: Design Systems are shared across your projects automatically — the library at `~/.kombai/design-systems/` is user-wide, so a Design System you create is available in every project on your machine.
* **Sharing design direction**: Your design system team creates a Design System and sends the `.ds` file to the team. Everyone saves it to their own library and uses it as a template for generating new designs.

This file-based approach ensures there's no lock-in to a specific design tool or platform—your design assets are portable, versioned, and always accessible.
