Customize branding and colors in Zapier Interfaces
Written by Owner
Updated at August 20th, 2025
- Tables
-
Product updates
Product updates: January 2023 Product updates: March 2023 Product updates: February 2023 Product updates: April 2023 Product updates: May 2023 Product updates: June 2023 Product updates: July 2023 Product updates: August 2023 Product updates: September 2023 Product updates: October 2023 Product updates: November 2023 Product updates: December 2023 Product updates: January 2024 Product updates: February 2024 Product updates: March 2024 Product updates: April 2024 Product updates: May 2024 Product updates: June 2024 Product updates: July 2024 Product updates: August 2024 Product updates: September 2024 Product updates: October 2024 Product updates: November 2024 Product updates: December 2024 Product updates: January 2025 Product updates: February 2025 Product updates: March 2025 Product updates: April 2025 Product updates: May 2025 Product updates: June 2025 Product updates: July 2025 Product updates: August 2025
- Zaps
- Your Zapier account
- Interfaces
- Canvas
- Chatbots
- Getting started
- Agents
- MCP
- Built-in tools
- Lead Router
- Apps
Table of Contents
Available on plans:
Free
Pro
Advanced
You can customize your Zapier interface theme by using your brand colors and logo.
Customize the theme
You can select a pre-made color theme or decide on specific colors for elements using Hex color codes or a color picker.
- In the left sidebar of your interface, click the Theme icon .
- You can then select a pre-made color theme, pick a brand color, or define each element's color individually.
.Use pre-made themes
You can select from a range of color themes, and your interface elements will match the selection.
- Once you're done, click Save.
Use a brand color
If you use the field Brand color, your interface will automatically tailor all elements to match that color. To see the hues and colors selected, click the Advanced color settings menu.
Edit individual elements
If you select a brand color, you can still change individual element colors:
- Click the Advanced color settings menu.
- Click the color swatch for the field you want to change. The color picker will open.
- Select a new color or paste a HEX value in the text field.
- Click Save.
(Optional) Use RGB or HSL values
- Click the up/down arrows beside the HEX text field to reveal RGB or HSL fields.
- Paste the values in the appropriate fields.
- Click Save.
Select colors individually
You can pick the colors for each interface element individually using the Advanced color settings menu. To change the colors:
- Click the Advanced color settings menu.
- Click the color swatch for the field you want to change. The color picker will open.
- Select a new color or paste a HEX value in the text field.
- Click Save.
(Optional) Use RGB or HSL values
- Click the up/down arrows beside the HEX text field to reveal RGB or HSL fields.
- Paste the values in the appropriate fields.
Click Save.
NoteYou cannot change fonts in your interface.
Use dark or light mode
You can choose whether your interface theme should be in light mode, dark mode, or match the system settings of the user visiting the interface. Theme colors will automatically update based on the selected option. To change the mode:
- In the left sidebar of your interface, click the Theme icon .
- Click the Theme dropdown menu.
- Select from:
- Light (default): uses the default color theme.
- Dark: uses a darker version of your color theme.
- System: uses the color mode defined by the user's system.
- Click Save.
Use your own branding
The Branding menu allows you to use your own logo and favicon (the icon that appears on the browser tab or window when you visit a website).
- In the left sidebar of your interface, click the Branding icon .
- Click Choose an image under the Logo field to upload a new logo image from your computer.
- Click Choose an image under the Favicon field to upload a new favicon image from your computer.
- The favicon must have a minimum resolution of 32x32 pixels.
.You can also choose whether to display a navigation bar on your interface's pages.
Remove the Zapier label
Available on plans:
Free
Pro
Advanced
In the Advanced plan, you can remove the Zapier label that appears on the bottom right corner of your interface's pages.
- In the left sidebar of your interface, click the Branding icon .
- Under the Display the “Built on Zapier” label field, click the toggle switch to turn it off. This will remove the Zapier label from your interface.
- Click Save changes.
Display your logo in the navigation
If you upload your logo in the Branding menu, you can also include it in your interface's navigation.
- In the left sidebar of your interface, click the Navigation icon .
- Under the Include my logo in the navigation field, click the toggle switch to turn it on.
- Click Save changes.
.Learn how to display the navigation bar on your interface's pages.
Provide feedback and get help
Submit feature requests, provide feedback, and get help from the Interfaces team.