# @clr/ui > CSS for Clarity Latest version **18.3.0** (published 2026-08-28) · MIT license · 0 weekly downloads ## Install ```sh npm install @clr/ui pnpm add @clr/ui yarn add @clr/ui bun add @clr/ui ``` ## Health **Score 55/100 (C)** — status: active. Positive: no vulnerabilities; recently updated; high maintenance score. Warnings: low downloads; no types; no esm support. ## Facts | | | |---|---| | Version | 18.3.0 | | Published | 2026-08-28 | | First published | 2017-12-15 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 0 | | Unpacked size | 5.9 MB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 430 | | Author | Clarity Design System | | Maintainers | jinnie, clarity-service-account, valentin-mladenov, danieltsanev | ## Links - npm: https://www.npmjs.com/package/@clr/ui - Repository: https://github.com/vmware-clarity/ng-clarity - Homepage: https://clarity.design - Issues: https://github.com/vmware-clarity/ng-clarity/issues - npm.io page: https://npm.io/package/@clr/ui ## Recent versions - 18.3.0 (latest) — 2026-08-28 - 18.2.2 (release-18.2.x) — 2026-08-11 - 18.0.0-beta.12 (beta) — 2026-05-05 - 17.13.0 (release-17.x) — 2026-04-14 - 15.14.8 (release-15.x) — 2025-01-09 - 16.6.0 (release-16.x) — 2024-11-25 - 17.0.0-next.2 (next) — 2024-02-09 - 13.18.3 (release-13.x) — 2023-11-08 - 12.4.4 (release-12.x) — 2023-04-04 - 15.0.0-rc.2 (rc) — 2023-02-13 - 5.5.3 (v5-lts) — 2022-01-24 - 4.0.15 (v4-lts) — 2021-05-06 - 3.1.15 (v3-lts) — 2021-01-07 - 2.4.11 (v2-lts) — 2021-01-07 - 1.3.9 (v1-lts) — 2020-06-17 - … 389 more at https://npm.io/package/@clr/ui/versions ## README ## Installing Clarity UI [![npm version](https://badge.fury.io/js/%40clr%2Fui.svg)](https://badge.fury.io/js/%40clr%2Fui) 1. Install Clarity UI package through npm: ``` npm install @clr/ui ``` 2. Include clr-ui.min.css in your HTML file and add the cds-theme attribute to your body tag: ``` ``` 3. Add the `cds-theme="light"` (or `cds-theme="dark"` for dark theme) to the body tag: ``` ``` 4. Write your HTML with the Clarity CSS class names and markup. ## Versioning The version of this library is aligned to the version of @clr/angular, and does not independently follow semantic versioning. While we strive to only introduce breaking changes in major versions, we may at times need to introduce a breaking change in a minor version in order to maintain alignment with the @clr/angular library. For projects that choose to use this package, we recommend pinning your project to a specific path version and treating each upgrade as a potentially breaking change. --- _Source: https://npm.io/package/@clr/ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._