# Custom Themes
Unstack provides a number of tools — both code and no-code — to customize your site's appearance. These include:
* [**The Style Guide**](#style-guide) - make branding and style changes *without* code
* [**Headers & footers**](#header-and-footer) - modify links, menus, and style, or go completely custom
* [**Custom integrations**](#custom-integrations) - add custom code to every page
* [**Custom code blocks** ](#custom-code-blocks)- add one-off code customizations to a single page
* [**Custom components**](#custom-components) - customize your building blocks *with* code
## Style Guide
{% hint style="info" %}
You must have the **Admin** role to view and edit the style guide.
{% endhint %}
The Unstack style guide provides a quick way to customize the branding and styles of your site without using code. It's designed to be so simple that anyone can use it:
Many aspects of your theme can be customized in the Style Guide, including:
* Branding
* Typography
* Button styles
* Forms styles
* Layout
* And more...
If you're not sure if Unstack has a no-code way of customizing your theme, the Style Guide is a great place to start. Component developers will especially want to be familiar with what's exposed here.
[Learn more about customizing the Style Guide →](https://support.unstack.com/hc/en-us/articles/1500004074422-Using-your-Styles-Guide)
## Headers & footers
Within the app, Unstack provides a way of customizing your header and footer without code:
This allows you to customize your menus, styles, and the basic layout of your header. The built-in header and footer do have some limitations, but they are excellent for [customizing your header or footer without code](https://support.unstack.com/hc/en-us/articles/4406957404695-Header-Formatting-Options).
If the built-in header and footer don't meet your needs, you can also build your own header and footer components with code.
[Learn more about custom header & footer components →](https://developer.unstack.com/docs/components/header-and-footer)
## Custom integrations
If you need a way to add custom code to *every page*, custom integrations are the way to go.
Custom integrations can be used to:
* **Tweak global CSS** for things not customizable in the Style guide
* **Add additional scripts** for analytics or functionality
* **Add a global banner** at the top or bottom of the page
* And more...
A custom integration can be inserted before or after the content of the page, or in the `` of the HTML.
[Learn more about custom integrations →](https://support.unstack.com/hc/en-us/articles/360062442373-Adding-HTML-CSS-or-JavaScript-to-all-your-pages)
## Custom code blocks
If you only need to add custom code to a single page, Unstack includes a Custom Code component that can be easily inserted into a page with the **Add Section** button within the page editor.
To add a custom code block:
1. Click the **Add section** button
2. Navigate to the **Custom Code** category
3. Select the **Custom Code** component
[Learn more about Custom Code blocks →](https://support.unstack.com/hc/en-us/articles/360062441913-Adding-HTML-CSS-or-JavaScript-to-single-page)
## Custom components
Building your own components will give you the ultimate flexibility. Unstack provides a simple component editor where you can develop components in a live preview environment:
Anyone with a small amount of HTML knowledge will feel at home in the component editor.
The component editor can be used to build a few different types of components:
* [**Sections**](https://developer.unstack.com/docs/components/section) - The main building blocks of Unstack pages.
* [**Headers & Footers**](#headers-and-footers) - If the built-ins don't work for you you can go custom.
* [**Banners**](https://developer.unstack.com/docs/components/banner) - Place anywhere on the page even above or below headers and footers.
[Learn more about building custom components →](https://developer.unstack.com/docs/getting-started/components)
