# @atlantum/core > AtlantumUI design tokens — primitives and semantic CSS variables Latest version **0.6.0** (published 2026-09-21) · MIT license · 0 weekly downloads ## Install ```sh npm install @atlantum/core pnpm add @atlantum/core yarn add @atlantum/core bun add @atlantum/core ``` ## Health **Score 65/100 (B)** — status: active. Positive: has types; esm support; no vulnerabilities; recently updated; high maintenance score. Warnings: low downloads; pre 1.0. ## Facts | | | |---|---| | Version | 0.6.0 | | Published | 2026-09-21 | | First published | 2021-04-09 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 0 | | Unpacked size | 44.7 KB | | Known vulnerabilities | 0 | | Install scripts | no | | Author | Qualifine | | Maintainers | arthurivanov | | Keywords | design-system, design-tokens, css-variables, theming | ## Links - npm: https://www.npmjs.com/package/@atlantum/core - Repository: https://github.com/ArthurIvanov/atlantum-ui - Homepage: https://github.com/ArthurIvanov/atlantum-ui#readme - Issues: https://github.com/ArthurIvanov/atlantum-ui/issues - npm.io page: https://npm.io/package/@atlantum/core ## Recent versions - 0.6.0 (latest) — 2026-09-21 - 0.5.3 — 2026-06-29 - 0.5.2 — 2026-06-29 - 0.5.1 — 2026-06-29 - 0.5.0 — 2026-06-29 - 0.4.0 — 2026-06-28 - 0.3.16 — 2021-08-04 - 0.3.15 — 2021-06-02 - 0.3.14 — 2021-05-08 - 0.3.13 — 2021-05-07 - 0.3.12 — 2021-05-01 - 0.3.11 — 2021-04-24 - 0.3.10 — 2021-04-24 - 0.3.9 — 2021-04-24 - 0.3.8 — 2021-04-19 - … 11 more at https://npm.io/package/@atlantum/core/versions ## README # @atlantum/core Design tokens for the [AtlantumUI](https://github.com/ArthurIvanov/atlantum-ui) design system — primitives and semantic CSS variables, themes. ## Installation ```bash npm i @atlantum/core # or pnpm add @atlantum/core ``` No peer dependencies required. ## Setup Import the base CSS once at the entry point of your app: ```ts // Semantic tokens (required) import "@atlantum/core/foundation.css"; // Raw color/typography primitives (optional, needed only if you reference primitive variables directly) import "@atlantum/core/primitives.css"; ``` ### Themes Apply a theme by importing its CSS and setting the `data-theme` attribute on the root element: ```ts import "@atlantum/core/foundation.css"; import "@atlantum/core/themes/dark.css"; ``` ```html … ``` | Import | Activates | |-------------------------------------|-----------------------------------------------| | `@atlantum/core/themes/dark.css` | Dark theme overrides (`data-theme="dark"`) | | `@atlantum/core/themes/professional.css` | Professional theme (`data-theme="professional"`) | | `@atlantum/core/themes/none.css` | Strips all theme overrides (flat palette) | | `@atlantum/core/index.css` | All of the above bundled together | ## CSS Variables All semantic tokens are available as CSS custom properties on `:root`. Reference them directly in your styles: ```css .card { background: var(--bg-surface-primary); color: var(--fg-neutral-loud-enabled); border: 1px solid var(--border-neutral-calm-enabled); } ``` Token categories: | Prefix | Description | |--------------------|----------------------------------------------| | `--bg-*` | Background fills (surfaces, accents, states) | | `--fg-*` | Foreground / text colors | | `--border-*` | Border colors | | `--brand-*` | Brand palette primitives | | `--accent-*` | Accent palette primitives | | `--gap-*` | Spacing aliases | ## JS / TypeScript API ```ts import { tokens } from "@atlantum/core"; import type { TokenName, TokenOverrides } from "@atlantum/core"; ``` ### `tokens` Object that maps semantic token names to their CSS variable strings. Use with `AtlantumUIProvider` for runtime token overrides: ```ts import { tokens } from "@atlantum/core"; const overrides: TokenOverrides = { [tokens.bgAccentLoudEnabled]: "#7c3aed", [tokens.brand500]: "#6d28d9", }; ``` ### `TokenName` Union type of all token CSS variable names (e.g. `"--bg-accent-loud-enabled"`). ### `TokenOverrides` `Partial>` — map of token names to override values, passed to `AtlantumUIProvider`. ## Changelog See [CHANGELOG.md](./CHANGELOG.md) for the full version history. ## License MIT --- _Source: https://npm.io/package/@atlantum/core · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._