# Theming
URL: /docs/react-native/theming

***

title: Theming
description: Learn how to customize the appearance
--------------------------------------------------

## Built-in themes

FeatureBuddy provide 2 built-in themes:

* `base`
* `dark`

You can use them by passing the `theme` prop to the `Features` component.

```jsx
import { Features, themes } from '@featurebuddy/react-native';

export const FeedbackScreen = () => {
  return <Features apiKey={apiKey} theme={themes.dark} />;
};
```

You can see how they look in the [Example section](/docs/react-native/example).

## Theming

You can fully customize the appearance of the FeatureBuddy UI by providing a theme object to the `Features` component.

```jsx
import { Features } from '@featurebuddy/react-native';

const apiKey = 'your-api-key';

const theme = {
  primary: '#000000',
  secondary: '#5E5E5E',
  accent: '#FFFFFF',

  primaryBackground: '#FFFFFF',
  secondaryBackground: '#ECECEC',
  accentBackground: '#4B6FEF',
  buttonBackground: '#2B2E38',

  button: '#FFFFFF',
  error: '#DC4F4F',
};

export const FeedbackScreen = () => {
  return <Features apiKey={apiKey} theme={theme} />;
};
```