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.

Gravity 12 now uses Shadcn components.

Check out the live demo 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.

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

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.

Please refer to the following sections for individual instructions on how to use each component.

Figma UI Kit

For prototyping, you can download the Shadcn UI kit for Figma.