Shadcn Whiteboard 1 Block

For AI Agents

Hand your agent this brief or the ReUI MCP, not a screenshot. Installs with a ReUI Pro or Ultimate license.

Best for: A design review board with restorable saved versions, a shape library fed from the selection and PNG or SVG export with a preview

When to use

Design reviews, retros and user flow sketches on a hand drawn canvas inside your product
Sprint planning on a shared canvas where lanes of cards total their points against capacity
An Excalidraw editor themed by your shadcn tokens that autosaves and opens or saves board files

When not to use

Sprint planning where lanes of cards total story points against capacity: use the Sprint Planning Board block
A wide gallery of searchable template thumbnails opened over the page, with no canvas: use the Template Library block
A bordered panel with a header band around dense data, with nothing to draw on: use the Frame component
An editable graph of connected steps, each with its own settings inspector: use the Flow blocks
Sprint work as cards dragged between stage columns, with no drawing canvas: use the Kanban Board blocks

Agent notes

SEEDED_VERSIONS fills the History tab and saveVersion only prepends a snapshot to React state, so versions vanish on reload
PresenceMenu reads the fixed VIEWERS list and takes no viewers prop, so replace that list with your live session members
SharePopover copies the fixed BOARD.shareUrl and Link access only adds an access=view query to it, so no sharing permission is saved anywhere
loadBoard returns a demo scene and saveBoard only waits on a timer; wire both to your storage, as onSave hands over the whole scene
Pin @excalidraw/excalidraw to 0.18.1: later releases rename the API and the editor DOM that the Whiteboard kit hides and proxies
Each page.tsx gives the board an h-svh wrapper and the board fills its parent; inside an app shell give that parent a height in place of it

Third-party API docs

Excalidraw: API reference, docs
Motion v12: API reference, docs (the docs follow the latest Motion, with no React API break since v12)
Sonner v2: API reference, docs

Markdownhttps://web.dev.reui.io/blocks/application/whiteboard/whiteboard-1.md

MCPget_block("whiteboard-1")

Installnpx shadcn@latest add @reui/whiteboard-1

Full index for agents:llms.txtReUI MCP setup

Shadcn Components in the Design Review Board Block

Dependencies

@excalidraw/excalidraw
cn
motion
sonner

Shadcn Design Review Board Block

Excalidraw Whiteboard for shadcn/ui with Frames, Presence, Templates and Versions. Part of the ReUI Shadcn Application Whiteboard blocks collection.

Embeddable Excalidraw whiteboard for shadcn/ui that fills any app content area and follows your tokens in light and dark: frames navigator, presence, templates, a shape library, PNG and SVG export, view only sharing and version restore.

It is composed from Alert Dialog, Avatar, Badge, Button, Button Group, Dialog, Dropdown Menu, Empty, and more, so every part of it is a primitive you can restyle with your own design tokens.

What You Can Build With the Design Review Board Block

Install it with the ReUI registry command in the toolbar above, then swap the placeholder content, data wiring, and business logic for your own.
Compare it across all eight ReUI styles and both the Base UI and Radix bases in the customizer before committing to one direction.
Combine it with the other Shadcn Application Whiteboard blocks to assemble a full screen instead of a single section.

All Shadcn Application Whiteboard Blocks

The rest of this category, each on its own page with a live preview, the components it is built from, and the install command.

Sprint Planning Board Excalidraw Sprint Planning Board with Capacity Lanes, Presence, Follow Mode and Decision Log

Related Shadcn Application Block Categories

App Shell (35) App shell layouts with sidebar, rail, or top bar navigation for dashboards, settings panels, and multi-page apps.
Auth (20) Login, register, forgot password, and two-factor authentication page layouts.
Card (43) Card components for content display, data summaries, and interactive elements.
Dashboard (8) Dashboard components and layouts that combine stats, charts, and tables into a complete overview screen.
Dialog (14) Dialog components for modal windows, alerts, confirmations, and content overlays.
Empty State (14) Empty state screens and no-data placeholders with recovery actions, onboarding prompts, and contextual guidance.

All Shadcn Block Groups

Browse the full ReUI Shadcn blocks library by product surface. Each group bundles category-level blocks you can mix and match across your project.

Shadcn Application Blocks (303) Browse 303 Shadcn Application blocks across 23 categories.
Shadcn Data Grid Blocks (47) Browse 47 Shadcn Data Grid blocks across 9 categories.
Shadcn Charts Blocks (52) Browse 52 Shadcn Charts blocks across 10 categories.
Shadcn Solutions Blocks (76) Browse 76 Shadcn Solutions blocks across 11 categories.
Shadcn AI & Agents Blocks (22) Browse 22 Shadcn AI & Agents blocks across 3 categories.
Shadcn eCommerce Blocks (87) Browse 87 Shadcn eCommerce blocks across 13 categories.
Shadcn Marketing Blocks (67) Browse 67 Shadcn Marketing blocks across 8 categories.

Frequently Asked Questions

When should I use the Design Review Board block?

Use it for a design review board with restorable saved versions, a shape library fed from the selection and PNG or SVG export with a preview.

The Whiteboard category fits:

Design reviews, retros and user flow sketches on a hand drawn canvas inside your product
Sprint planning on a shared canvas where lanes of cards total their points against capacity
An Excalidraw editor themed by your shadcn tokens that autosaves and opens or saves board files

For sprint planning where lanes of cards total story points against capacity, use the Sprint Planning Board block. For a wide gallery of searchable template thumbnails opened over the page, with no canvas, use the Template Library block. For a bordered panel with a header band around dense data, with nothing to draw on, use the Frame component. For an editable graph of connected steps, each with its own settings inspector, use the Flow blocks. For sprint work as cards dragged between stage columns, with no drawing canvas, use the Kanban Board blocks.

What is the Design Review Board block built with?

Design Review Board uses Alert Dialog, Avatar, Badge, Button, Button Group, Dialog, Dropdown Menu, Empty, Field, Icon Tile, Input, Input Group, Item, Kbd, Popover, Select, Separator, Sheet, Skeleton, Spinner, Switch, Tabs, Toggle, Toggle Group, Tooltip. Installing the block through the ReUI registry pulls those dependencies in for you.

Can I restyle the Design Review Board block?

Yes. It reads your design tokens, so switching style, radius, base color, font, or icon library in the customizer restyles it without touching the markup.

How should I use Shadcn whiteboard blocks in a real project?

Treat them as structured starting points. Keep the layout, hierarchy, and interaction ideas that work, then replace placeholder content, data wiring, and business logic with your own product requirements.

Start building with ReUI Pro today.

Every Pro block, every style, and every future addition, with one license for unlimited projects.

Get All-Access

From $249, once. Lifetime updates.