# Themes

## Overview

Vera comes with two color themes (Construction and Water) which should be used depending on the application's origin and purpose.

<a href="/tokens/colors">Click here to view theme colors</a>

## How to use a theme?

Include theme you want to use and apply it to the root element of your application as `className` property:

```jsx
import { themes } from '@gemini-suite/vera-react';

<Box className={themes.construction}>
  <App />
</Box>;
```

All components wrapped in `Box` component will inherit the theme colors.