# @univerjs/design

> Shared React design components, styles, and locale resources for Univer UI packages.

Latest version **1.0.1** (published 2026-09-24) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @univerjs/design
pnpm add @univerjs/design
yarn add @univerjs/design
bun add @univerjs/design
```

## Health

**Score 80/100 (A)** — status: active.

Positive: has types; esm support; no vulnerabilities; has provenance; recently updated; high maintenance score; high quality score; popular repo.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2026-09-24 |
| First published | 2023-12-05 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 11 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 15169 |
| Author | DreamNum Co., Ltd. <developer@univer.ai> |
| Maintainers | jikkai, wbfsa, mengshukeji |
| Keywords | univer, design-system, ui, react, components |

## Links

- npm: https://www.npmjs.com/package/@univerjs/design
- Repository: https://github.com/dream-num/univer
- Homepage: https://univer.ai
- Issues: https://github.com/dream-num/univer/issues
- Funding: https://opencollective.com/univer
- npm.io page: https://npm.io/package/@univerjs/design

## Dependencies (11)

- [cmdk](https://npm.io/package/cmdk.md) 1.1.1
- [sonner](https://npm.io/package/sonner.md) ^2.0.8
- [@univerjs/icons](https://npm.io/package/@univerjs/icons.md) 1.43.0
- [@radix-ui/react-slot](https://npm.io/package/@radix-ui/react-slot.md) ^1.3.3
- [@radix-ui/react-dialog](https://npm.io/package/@radix-ui/react-dialog.md) ^1.1.23
- [@radix-ui/react-popover](https://npm.io/package/@radix-ui/react-popover.md) ^1.1.23
- [class-variance-authority](https://npm.io/package/class-variance-authority.md) ^0.7.1
- [@radix-ui/react-direction](https://npm.io/package/@radix-ui/react-direction.md) ^1.1.4
- [@radix-ui/react-separator](https://npm.io/package/@radix-ui/react-separator.md) ^1.1.15
- [@radix-ui/react-hover-card](https://npm.io/package/@radix-ui/react-hover-card.md) ^1.1.23
- [@radix-ui/react-dropdown-menu](https://npm.io/package/@radix-ui/react-dropdown-menu.md) ^2.1.24

## Alternatives

- [@progress/kendo-ooxml](https://npm.io/package/@progress/kendo-ooxml.md) — 152.1K weekly downloads
- [@progress/kendo-react-ripple](https://npm.io/package/@progress/kendo-react-ripple.md) — 8.0K weekly downloads
- [@progress/kendo-react-orgchart](https://npm.io/package/@progress/kendo-react-orgchart.md) — 4.3K weekly downloads
- [@praxisui/dynamic-fields](https://npm.io/package/@praxisui/dynamic-fields.md) — 2.4K weekly downloads
- [@mesalvo/react-ui](https://npm.io/package/@mesalvo/react-ui.md) — 1.7K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2026-09-24
- 1.0.0-rc.0 (rc) — 2026-09-10
- 1.0.0-beta.2 (beta) — 2026-08-22
- 1.0.0-insiders.20260813-7c9aa50 (insiders) — 2026-08-13
- 1.0.0-alpha.8 (alpha) — 2026-07-29
- 0.12.4-experimental.20251211-e01e32a (experimental) — 2025-12-11
- 0.12.3-nightly.202512060617 (nightly) — 2025-12-06
- 1.0.0 — 2026-09-23
- 0.25.2 — 2026-09-17
- 1.0.0-beta.1 — 2026-08-15
- 1.0.0-insiders.20260809-70eefdd — 2026-08-09
- 1.0.0-insiders.20260808-70eefdd — 2026-08-08
- 1.0.0-beta.0 — 2026-08-05
- 1.0.0-insiders.20260805-b15e7f3 — 2026-08-05
- 1.0.0-insiders.20260804-bf9a7c5 — 2026-08-04
- … 716 more at https://npm.io/package/@univerjs/design/versions

## README

# @univerjs/design

[![npm version](https://img.shields.io/npm/v/@univerjs/design?style=flat-square)](https://npmjs.com/package/@univerjs/design)
[![license](https://img.shields.io/npm/l/@univerjs/design?style=flat-square)](https://npmjs.com/package/@univerjs/design)
[![downloads](https://img.shields.io/npm/dm/@univerjs/design?style=flat-square)](https://npmjs.com/package/@univerjs/design)

`@univerjs/design` contains the shared React design components, tokens, styles, and locale resources used by Univer UI packages.

## Package Overview

| Package | UMD global | CSS | Locales | Facade entry |
| --- | --- | :---: | :---: | :---: |
| `@univerjs/design` | `UniverDesign` | Yes | Yes | No |

## Installation

```sh
pnpm add @univerjs/design
# or
npm install @univerjs/design
```

Keep all `@univerjs/*` packages on the same version.

## Usage

```ts
import '@univerjs/design/lib/index.css';
import DesignEnUS from '@univerjs/design/locale/en-US';
```

## Resources

- [Documentation](https://docs.univer.ai)
- [NPM package](https://npmjs.com/package/@univerjs/design)
- [GitHub repository](https://github.com/dream-num/univer)

---
_Source: https://npm.io/package/@univerjs/design · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._