# Configure Appearance

To customize the appearance of your Privacy Center, prepare a CSS stylesheet with your desired styles. You can then apply these styles in two ways:

1. [Through the API](/content/docs/privacy-center-fidesjs/privacy-center/configuration#recommended-api-based-configuration/index.html)
2. [By uploading the file as `config.css` to `/privacy-center/config`](/content/docs/privacy-center-fidesjs/privacy-center/configuration#file-based-configuration/index.html)

## Chakra UI CSS [Permalink for this section](/content/docs/privacy-center-fidesjs/privacy-center/appearance#chakra-ui-css/index.html)

By default, Fides uses the [Chakra UI (opens in a new tab)](https://chakra-ui.com/) framework to speed up styling.

### Example: customizing heading text CSS [Permalink for this section](/content/docs/privacy-center-fidesjs/privacy-center/appearance#example-customizing-heading-text-css/index.html)

In order to modify the heading text, Chakra has a default `chakra-heading` class style that is assigned to `h1`, `h2`, `h3`, `h4` and so on. To modify this style you can apply to all headings to specify a heading size:

**Privacy Center Heading CSS**

```css
/* Apply changes to all headings of the site */
.chakra-heading {
    color: #0000FF; /* Set text color to blue */
    font-size: 1.5em; /* Increase font size by 50% */
    font-weight: 300; /* Lighten font weight */
}
/* Apply changes only to heading 2 <h2> */
h2.chakra-heading {
    color: #0000FF; /* Set text color to blue */
    font-size: 1.5em; /* Increase font size by 50% */
    font-weight: 300; /* Lighten font weight */
}
```

You can read a helpful list of the [styled Chakra properties (opens in a new tab)](https://chakra-ui.com/docs/styled-system/style-props) here.
