Web SDK

Core Features

Plugins Info

Univer Boards core combines a page-and-element model with an interactive browser canvas. The model and UI are delivered by two Web SDK packages and operate as an independent UNIVER_BOARD unit.

Features

  • Pages and element ordering: Store pages in pages and drawable objects in each page's elements, with explicit order arrays for both levels.
  • Canvas elements: Work with text, shapes, images, connectors, groups, containers, and swimlanes.
  • Command-driven editing: Route element changes, ordering, and parent relationships through one command layer with permissions and hooks for optional history and collaboration integrations.
  • Browser canvas: Render elements and provide selection, transforms, clipboard, text editing, viewport controls, and panels.
  • Extensible adapters: Add optional Board capabilities such as tables, mind maps, charts, resources, print, and exchange.
  • Persistence: Create, restore, and save an IBoardData snapshot, including pages, resources, themes, and active-page state.

Preset Mode

Univer Boards does not currently provide a dedicated preset. Use plugin mode for both the model and browser UI.

Plugin Mode

Installation

Add the two Boards product packages to the Univer runtime described in Installation & Basic Usage:

Shell
pnpm add @univerjs-pro/boards @univerjs-pro/boards-ui

Product plugin registration

Register the shared render, document, drawing, ink, shape-editing, and license dependencies first as shown in the installation guide, then register the Boards plugins:

TypeScript
import { UniverBoardsPlugin } from '@univerjs-pro/boards'import { UniverBoardsUIPlugin } from '@univerjs-pro/boards-ui'import '@univerjs-pro/boards-ui/lib/index.css'univer.registerPlugin(UniverBoardsPlugin)univer.registerPlugin(UniverBoardsUIPlugin)

UniverBoardsPlugin registers the Board model, commands, element services, adapters, and permissions. UniverBoardsUIPlugin adds the rendered canvas and browser interactions.

How is this guide?

© 2026 DreamNum Co., Ltd.