# Components

Gravity comes packaged with a library of pre-built components to build your own user interface at warp speed without any design skills. Shadcn utilised Radix UI so it's fully accessible to WAGC2 standards.

{% hint style="success" %}
Gravity 12 now uses Shadcn components.&#x20;
{% endhint %}

[Check out the live demo](https://demo.usegravity.app) to see the components in action.

Most of the components from Shadcn are available by default in Gravity. If not, you can install it easily:

```
npx shadcn-ui@latest add component-name
```

### Importing Components

You can import components from a global barrel file rather than having to remember where each component is stored.

```javascript
import { Form, Card } from 'components/lib';
```

{% hint style="warning" %}
Using the barrel file will decrease performance by loading all the components into the bundle.  If you want to avoid this, you can import directly from the component file.
{% endhint %}

Please refer to the following sections for individual instructions on how to use each component.&#x20;

### Figma UI Kit

For prototyping, you can [`download the Shadcn UI kit for Figma`](https://www.figma.com/community/file/1203061493325953101/shadcn-ui-design-system).
