# Clarity Core Web Components [![npm version](https://badge.fury.io/js/%40clr%2Fcore.svg)](https://badge.fury.io/js/%40clr%2Fcore)
Clarity Core is a suite of Web Components for [Clarity Design System](https://clarity.design/storybook/core).
## Quick Start Install
1. First, install the Clarity Core package from npm.
```bash
npm install @cds/core --save
```
2. Import desired Web Component into your JavaScript or TypeScript
```typescript
import '@cds/core/modal/register.js';
```
Full installation steps can be found in the [Core Getting Started Guide](https://clarity.design/storybook/core/?path=/story/documentation-getting-started--page).
## Usage
### No Framework
```html
slot content
```
### Angular
```html
slot content
```
### Vue
```html
slot content
```
### React via `@cds/react` package
```jsx
/*
- `size` unlike the examples above `size` is set as a property
- closable is setting a property on the element
- onCloseChange is listening for the `closeChange` custom event
*/
slot content
```