Clarity Design System

Project Clarity is an open source design system that brings together UX guidelines, an HTML/CSS framework, Angular components, and Web Components. This repository includes everything you need to build, customize, test, and deploy Clarity. For complete documentation, visit the Clarity website.

Getting Started

Clarity is published as four npm packages:

• @clr/icons Contains the custom element icons.
• @clr/ui Contains the static styles for building HTML components.
• @clr/angular Contains the Angular components. This package depends on @clr/ui for styles.
• @cds/core. Contains the Web Components that work in any JavaScript framework.

Installing Clarity

• Install CSS Only
• Install Icons
• Install Angular Components
• Install Web Components

Documentation

For documentation on the Clarity Design System, including a list of components and example usage, see our website.

Contributing

The Clarity project team welcomes contributions from the community. For more detailed information, see CONTRIBUTING.md.

Licenses

• The Clarity Design System is licensed under the MIT license.
• The font is licensed under the Open Font License (OFL).

Feedback

If you find a bug or want to request a new feature, please open a GitHub issue.

Include a link to the reproduction scenario you created by forking one of the Clarity Stackblitz Templates for the version you are using at Clarity StackBlitz templates.