# @donkit-ai/design-system

> Donkit Design System - minimal design tokens and React components

Latest version **1.4.96** (published 2026-10-20) · 0 weekly downloads

## Install

```sh
npm install @donkit-ai/design-system
pnpm add @donkit-ai/design-system
yarn add @donkit-ai/design-system
bun add @donkit-ai/design-system
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score.

Warnings: low downloads.

## Facts

| | |
|---|---|
| Version | 1.4.96 |
| Published | 2026-10-20 |
| First published | 2026-03-20 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 397.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | pristupadonkit, dan_donkit |

## Links

- npm: https://www.npmjs.com/package/@donkit-ai/design-system
- Repository: https://github.com/donkit-ai/design-system
- Homepage: https://github.com/donkit-ai/design-system#readme
- Issues: https://github.com/donkit-ai/design-system/issues
- npm.io page: https://npm.io/package/@donkit-ai/design-system

## Dependencies (1)

- [lucide-react](https://npm.io/package/lucide-react.md) ^0.445.0

## Recent versions

- 1.4.96 (latest) — 2026-10-20
- 1.4.95 — 2026-10-01
- 1.4.94 — 2026-10-01
- 1.4.93 — 2026-09-30
- 1.4.92 — 2026-08-31
- 1.4.91 — 2026-08-28
- 1.4.90 — 2026-08-28
- 1.4.89 — 2026-08-28
- 1.4.88 — 2026-08-28
- 1.4.87 — 2026-08-21
- 1.4.85 — 2026-08-17
- 1.4.84 — 2026-08-17
- 1.4.83 — 2026-08-12
- 1.4.82 — 2026-08-07
- 1.4.81 — 2026-08-07
- … 161 more at https://npm.io/package/@donkit-ai/design-system/versions

## README

# Donkit Design System

Minimal design tokens and React components for Donkit products. Includes product skins data-variant=edgy and data-typography=editorial.

## Install

```bash
npm install @donkit-ai/design-system
```

## Usage

```js
import '@donkit-ai/design-system/tokens.css';
// optional:
// import '@donkit-ai/design-system/light.css';
// import '@donkit-ai/design-system/high-contrast.css';

import { Button, Input, Card, LocaleProvider } from '@donkit-ai/design-system';
```

## Package contents

Shared components + brand tokens.

**Includes product skins:** `data-variant=edgy`, `data-typography=editorial` (baked into `tokens.css`). The Atom package does **not** receive these.

## Font contract

**This package does not embed font binaries.** Host loads webfonts (e.g. `public/fonts/`) and must match the families in CSS variables.

| Role | CSS variable | Family | Files (host) |
|------|--------------|--------|--------------|
| UI | `--font-ui` | **Inter** | (host-provided) |
| Mono | `--font-mono` | **Fira Code** | FiraCode-Variable.woff2 |

Host also owns product chrome (wordmark, favicon, platform_name) — not this package.

Font binaries are NOT in the package. Host loads fonts.files when self-hosting. data-variant=edgy and data-typography=editorial are supported product skins.

## Locale

Chrome strings (Close, Loading, …) default to English. Override via `LocaleProvider`:

```js
import { LocaleProvider } from '@donkit-ai/design-system';

<LocaleProvider strings={{ close: 'Закрыть', loading: 'Загрузка' }}>
  <App />
</LocaleProvider>
```

## Appearance (optional)

```js
import appearance from '@donkit-ai/design-system/appearance.json';
// { brand, themes, variants, typography, density, fonts }
```

| brand | themes | variants | typography |
|-------|--------|----------|------------|
| `donkit` | light, high-contrast | edgy | editorial |

## Version

`1.4.96` — dual-brand publish from one monorepo commit. Package contents = applicable surface for this brand only.

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