# Theme variables

This section describes the variables that you can customize in /assets/css/02\_variables.css

| Variable | Description |
| --- | --- |
| --primary-color | This color is used on the main components of the portal, such as API<br>titles, Markdown headers or links. |
| --secondary-color | This color is used for components such as the background of the<br>portal and of operation descriptions. |
| --header-background | This color is used for the header background. |
| --header-color | This color is used for the header text. |
| --header-brand-logo | This variable specifies the file to use as the brand logo. You can<br>edit it by replacing the default file itself or by uploading a new file<br>and changing the path in this variable. |
| --footer-background-color | This color is used for the footer background. |
| --footer-color | This color is used for the footer text. |
| --get-request-color | This color is used for the text on the GET<br>badge. |
| --get-request-background-color | This color is used for the background of the GET<br>badge. |
| --head-request-color | This color is used for the text on the HEAD<br>badge. |
| --head-request-background-color | This color is used for the background of the HEAD<br>badge. |
| --options-request-color | This color is used for the text on the OPTIONS<br>badge. |
| --options-request-background-color | This color is used for the background of the<br>OPTIONS badge. |
| --post-request-color | This color is used for the text on the POST<br>badge. |
| --post-request-background-color | This color is used for the background of the POST<br>badge. |
| --patch-request-color | This color is used for the text on the PATCH<br>badge. |
| --patch-request-background-color | This color is used for the background of the PATCH<br>badge. |
| --put-request-color | This color is used for the text on the PUT<br>badge. |
| --put-request-background-color | This color is used for the background of the PUT<br>badge. |
| --delete-request-color | This color is used for the text on the DELETE<br>badge. |
| --delete-request-background-color | This color is used for the background of the DELETE<br>badge. |
| --color--neutral | This color is used for text in components such as the<br>Optional badge and examples. |
| --color--neutral-bg | This color is used for the background in components such as the<br>Optional badge and examples. |
| --color--warn-bg | This color is used for the background in components such as the<br>Required badge and the 4XX status<br>badge. |
| --color--warn | This color is used for text in components such as the<br>Required badge and the 4XX status<br>badge. |
| --color--error-bg | This color is used for the background in components such as the<br>5XX status badge. |
| --color--error | This color is used for text in components such as the<br>5XX status badge. |
| --color--redirect-bg | This color is used for the background in components such as the<br>3XX status badge. |
| --color--redirect | This color is used for text in components such as the<br>3XX status badge. |
| --color--success-bg | This color is used for the background in components such as the<br>2XX status badge. |
| --color--success | This color is used for text in components such as the<br>2XX status badge. |
| --font-family-sans-serif | This variable defines the font to use for the whole<br>portal. |
| --font-size-xxs | This font size is used for components such as request method<br>badges. |
| --font-size-xs | This size is used as the root font size. If you change this value,<br>all other font sizes will change proportionally. |
| --font-size-sm | This font size is used for components such as the API names on the<br>homepage. |
| --font-size-md | This font size is used for components such as the portal header and<br>API section titles. |
| --font-size-lg | This font size is used for components such as API names in the API<br>documentation. |