Atom Design System

Design tokens and React components for Atom products. Same component API as the shared core; Signal brand tokens are baked into tokens.css. Does not include foreign product skins (round / editorial). Use light.css for Snow light theme. Host loads Onest + JetBrains Mono webfonts.

Install

npm install @agentatom/design-system

Usage

import '@agentatom/design-system/tokens.css';
// optional:
// import '@agentatom/design-system/light.css';
// import '@agentatom/design-system/high-contrast.css';

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

Package contents

Shared components + Atom brand tokens (Signal / Graphite / Onest).

Not included: product skins data-variant=round / data-typography=editorial. Those ship only in the sibling brand package. Leftover host attributes for those skins are a no-op here.

Font contract

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

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

Font binaries are NOT in the package. Host must load fonts.files under public/fonts (or equivalent) and keep --font-ui / --font-mono in sync. Package does not ship data-variant=round or data-typography=editorial.

Locale

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

import { LocaleProvider } from '@agentatom/design-system';

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

Appearance (optional)

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

Version

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