# Canvas comments, hidden variants, new sizes and custom icons in DS Manager
> DS Manager adds comments pinned to the canvas, a way to hide kit variants and sizes, an Add size dialog, custom SVG icons, canvas zoom and color, and dark-mode logos.
Published: 2026-10-22 · Author: Matt Wierzbicki · Canonical: https://www.shadcndesign.com/blog/shadcn-canvas-comments-variants-custom-icons
You can now leave comments right on the [DS Manager](/ds-manager) canvas, and so can the people you share a system with. Your agent can read those threads, make the changes and resolve them. This update also lets you hide kit variants and sizes you don't use, adds a dialog for new sizes, and lets Pro accounts upload their own SVG icons. On top of that there's canvas zoom and color, logos that work in dark mode, and a simpler agent setup in Settings.
Everything below is live at [manager.shadcndesign.com](https://manager.shadcndesign.com).
## Comments on the canvas
Press **C**, or click **Comments** in the top bar, then click anything on the canvas: a button variant, a color swatch, a type slot, a ProBlocks block or a page section. A pin drops there and a comment box opens. The pin stays attached to that element when you edit, zoom or resize the canvas.
In a thread you can reply, edit or delete your own comments, and click **Resolve** when it's done. The **Comments** panel lists every thread grouped by page, with the current page first. Filter it to **Open**, **Resolved** or **All**, or to **Only this page**. Each row also has a **⋮** menu, so you can resolve, reopen or delete a thread without opening it.
New replies show as a blue dot on the Comments button, and the sidebar shows how many open threads each page has.
Comments also work on share links. People signed in to DS Manager can comment on a shared system while **Signed-in users can comment** is ticked in the **Share** popover. The box is on by default, also for links you shared before this update, so untick it if you'd like a link to stay view-only.
On Pro, type **@agent** in a comment or click **Ask agent** in a thread. The Agent tab opens with the comment attached. Press send, and the agent makes the change, replies in the thread and resolves it. Agents connected over MCP get the same comments, so you can ask Claude Code or Cursor to go through the open comments on your system.
## Hide variants and add sizes
shadcn/ui components ship with variants and sizes your system may not need. Under the Variant and Size menus, **Manage variants** now lists every built-in value, so you can hide the ones you don't want.
When you hide a value, you pick what replaces it in **Use instead**. Hide Button's `outline` with `secondary` instead, and every outline button in the kit, ProBlocks, your custom components and your installed code looks like secondary. Code that still passes `variant="outline"` keeps working. The default value can't be hidden. A short line under the menus, like "1 variant hidden", opens the dialog again.
Adding a size no longer means typing utilities. Click **Add size** under the menus, or **Add new…** in the Size menu:
- **Controls sizes** adds sm and lg to Button, Toggle and Input at the heights from the Controls page, and they keep following it.
- **Or add one size**: name it, pick the size to **Start from** and a **Scale** from 0.75× to 2×. The dialog shows the height, padding, text size and icon size it will write, and you can untick any of them.
When you add the size, the canvas scrolls to it and selects it. Input, Textarea, Badge and Kbd can take sizes now too, and the installed files get a real `size` prop.
## Your own SVG icons
Pro accounts can add their own icons next to the icon library. On the **Icons** page, drop SVG files on **Custom icons**. DS Manager redraws each file on the 24px grid in `currentColor`, with your library's stroke, so it sits well next to Lucide, Tabler, Hugeicons, Phosphor or Remix Icon icons.
Select an icon to rename it or remove it. Installing the system writes your icons to `components/icons.tsx` in the library's own format. A system holds up to 500 custom icons. Agents can add, rename and remove them over MCP too.
## Canvas zoom and canvas color
Every canvas now zooms like a Figma frame, from 25% to 400%. Pinch or hold ⌘ and scroll to zoom toward the pointer, and drag with Space held down to pan. The **%** button in the page header opens the **Zoom** menu: **Zoom to fit** is ⇧1 and **Zoom to 100%** is ⇧0.
Next to it, the **Canvas color** swatch sets the background the canvas is drawn on, separately for light and dark mode. The color is saved with your system, and labels on the canvas switch to light text on a dark color.
## Logos in dark mode
On the **Brand** page, Logo and Mark now take two files: **File (light)** and **File (dark)**. If you only upload a light logo, **Dark fallback** decides what dark mode shows. A one-color logo is drawn in the text color by default, so a black logo turns white.
The new **Height** setting sizes the logo in every ProBlocks block and in the installed `logo.tsx`. Uploaded SVGs that had no size of their own now sit at the right height in navbars and sign-in pages instead of filling the row.
## Set up your agent in one list
**Settings > MCP** now has one list of agents: Claude Code, Cursor, VS Code, Codex, Claude.ai and Claude desktop. Open a row to see its setup. Cursor and VS Code install with one click through **Add to Cursor** and **Add to VS Code**. Once an agent is connected, its row says **Connected** with the time of its last call, and **Revoke** disconnects it.
## Groups and archive for custom components
Custom components can now go into groups. Open a component's **⋮** menu on the right rail and pick **Move to group**, then a group or **New group…**. The sidebar shows your groups as folders above the ungrouped components.
**Archive** takes a component out of publish, install and share links without deleting it. Archived components wait in an **Archived** folder at the bottom of the list, and **Restore** brings one back.
## Trace and Code Block join the kit
shadcn/ui's new **Trace** and **Code Block** components are in the kit. You can style them, lock them and install them like any other component, and Code Block brings its `shiki` dependency along.
Sonner is gone from the kit, and **Toast** now handles toasts. The demos that used Sonner show a Toast instead. Your next publish no longer includes `sonner`, while versions you published before still serve it. The kit now has 62 components.
## Smaller improvements
- **Agent steps you can open.** In the Agent tab, each step the agent takes is a line you can open to see what it changed, like a token diff with swatches or a picture of the canvas. When the agent is done, the steps fold into one line, such as "Worked for 18s · 6 steps".
- **Ask the agent about DS Manager.** The in-app agent now answers questions like "If I publish, is it public?" or "How do I add a dark logo?" and points you to the right place.
- **Uploaded fonts for agents.** Agents can set a font you uploaded to the system, not only Google fonts.
- **Hard-to-see variants.** A variant that would be invisible on its cell, like white text with no fill, is drawn on a dark box labeled "on dark", or a light box labeled "on light".
- **Forms work in the preview.** Form demos submit inside the canvas, so you see their toast and validation errors.
- **Utility suggestions** open under the field instead of stretching the row of chips.
## Changelog
**Added**
- Canvas comments with pins, threads, the Comments panel, read and unread, and a ⋮ menu on each thread.
- Comments on share links for signed-in users, with **Signed-in users can comment** in the Share popover.
- **@agent** and **Ask agent** on Pro, and `read_comments` and `write_comment` for MCP agents.
- Hide a kit variant or size with **Use instead** in **Manage variants**.
- **Add size** dialog with Controls sizes and a scale, and sizes for Input, Textarea, Badge and Kbd.
- Custom SVG icons on Pro, and `set_icons` for MCP agents.
- Canvas zoom from 25% to 400% and the Zoom menu.
- **Canvas color** for light and dark, saved per system.
- **File (dark)**, **Dark fallback** and **Height** for Logo and Mark.
- VS Code in Settings > MCP, and one-click **Add to Cursor** and **Add to VS Code**.
- Groups and archive for custom components.
- Trace and Code Block components.
**Improved**
- Settings > MCP shows each agent's setup and connection in one row.
- Agent steps show what they changed and fold when the turn ends.
- The in-app agent answers questions about DS Manager.
- Agents can set uploaded fonts.
- Invisible variants are drawn on a contrasting box.
- Form demos submit in the preview.
- Toast replaces Sonner.
**Fixed**
- Changing Icon size on one Button size no longer changes the others.
- The avatar group's "+N" count follows the avatar's size.
- Radius edits reach the outer corners of Button Group, Input Group and Toggle Group.
- Card shadows are no longer cut off on Overview and Style.
- A zoomed ProBlocks block fills the canvas with no gray strips at the sides.
- Uploaded logos sit at the right height in navbars and sign-in blocks.
- The agent's canvas screenshots no longer time out.
- When an agent adds a class, it replaces the class it overrides, and one undo brings the old one back.
- A plan bought under another email can be attached to an account with a kit purchase.
## Free and Pro
Comments, hidden variants, Add size, canvas zoom and color, dark-mode logos and the new components come with every account, Free included. Pro adds **@agent** and **Ask agent**, custom icons, custom components and their groups, and all 337 ProBlocks. Free accounts can try the MCP server with 50 edits and 500 reads.
Pro is $19 a month or $180 a year, and Lifetime accounts get everything in Pro. Compare the plans on the [DS Manager page](/ds-manager#pricing).
Try the comments on your own system and tell me what you'd like next at [hi@shadcndesign.com](mailto:hi@shadcndesign.com).