Color schemes let you control the colors used across your guidelines, including backgrounds, type styles, buttons, lists, and accent colors. You can create and manage multiple color schemes and apply them to different parts of your guidelines to keep the experience consistent and on brand.
Color schemes are available on all modern themes (Classic, Muse, and Paper). If you are using a custom theme built with the Brand SDK, ensure theme styling support is enabled. (Note: The legacy theme has been retired).
Customize type styles, lists, buttons, and accent colors
Typography has moved to the guidelines navigation powerbar, where you can set up your custom type styles before further customizing their appearance in Color schemes.
Set up custom type styles
Set up your custom type styles in Typography before adjusting their colors in Color schemes. You can update predefined styles and custom styles to suit your brand.
Open Typography in the powerbar.
Under Type styles, keep the default scheme selected.
Select a custom type style from the list and click on the edit icon to configure its settings. Here you can choose a font, customize font size, weight, letter spacing, line height, margins, and enable other text formatting options.
Click Save to apply your changes.
Any text using this custom style will automatically update to reflect the new settings.
Type styles in Frontify
In Frontify, type styles are predefined and include options such as headings (H1–H4), body text, quotes, and three custom styles. While you cannot duplicate existing styles or create additional style slots, you can modify the predefined styles, including the custom styles, to suit your needs. Custom styles are particularly useful for creating unique text formats, such as a white body text style.
Customize default color scheme
Customize the default color scheme to control the colors used across your guidelines, including backgrounds, type styles, lists, buttons, icons, and accents. Any changes you make will automatically apply to all theme pages using it.
Background color: Choose from your brand palette or set custom primary and secondary colors.
Type style colors: Set the colors used for headings, body text, quotes, and custom type styles. To change things like font, size, weight, spacing, or other type settings, go to Typography in the powerbar.
Lists: Set brand or custom colors for bulleted and numbered list levels.
Buttons: Customize primary, secondary, and tertiary buttons, including their default and hover states.
Accent colors: Adjust colors for info, notes, tips, and warnings to align with your brand.
Create and manage color schemes
Create a new color scheme
To create a new color scheme, follow these steps:
Open Color schemes in the powerbar.
Open the three-dot Actions menu next to the selected color scheme.
Select Create new.
Give your new color scheme a name and click Create.
Your new color scheme will appear in the dropdown menu and is ready to be customized.
Rename your color scheme
To rename your color scheme, follow these steps:
Open Color schemes in the powerbar.
Select the color scheme you want to rename.
Open the three-dot Actions menu next to the color scheme.
Select Rename.
Give your color scheme a new name and click Rename.
Delete your color scheme
To delete your color scheme, follow these steps:
Open Color schemes in the powerbar.
Select the color scheme you want to delete.
Open the three-dot Actions menu next to the color scheme.
Select Delete and confirm.
Add background color to document pages
Apply your color scheme to all document pages
Once you’ve created a color scheme, follow these steps to apply it to all document pages:
First, make sure you are navigating a document page in your guideline.
Open Themes in the powerbar.
Select All documents to apply the color scheme to all pages using this theme.
Scroll down to the Content area section.
Open the Color scheme dropdown menu and choose the color scheme you want to apply.
The selected color scheme will apply across all document pages using the theme.
Apply your color scheme to a specific document page
Once you’ve created a color scheme, follow these steps to apply it to a specific document page:
First, make sure you are navigating the exact document page you want to customize.
Open Themes in the powerbar.
Select This page to apply the color scheme to the specific document page you are on.
Scroll down to the Content area section.
Open the Color scheme dropdown menu and choose the color scheme you want to apply.
The selected color scheme will now apply only to that specific page, leaving all other document pages untouched.
Apply color schemes to individual sections, footers, and library pages
Apply color schemes to individual sections
You can now apply color schemes to individual sections within a document or guideline page, giving you precise visual control without affecting the entire layout. This helps break up content, build visual hierarchy, and keep your guidelines polished and readable.
To apply a color scheme to a section:
Hover over the section and click the section settings icon.
Open the Color scheme dropdown menu.
Choose from your available color schemes.
You can apply different schemes to each section for better organization and impact.
Apply color schemes to footers
You can customize the appearance of your footer by applying a color scheme. Because a color scheme defines both background and text styling together, selecting a single scheme coordinates your entire footer styling.
How to apply a color scheme to your footer:
Open Themes in the powerbar.
Choose whether you want your footer changes to apply to All documents or This page.
Scroll down to the Footer section.
Open the Color scheme dropdown menu and choose the color scheme you want to apply.
The selected color scheme will automatically apply its background color to the footer background and its configured text and link styles to the footer content.
Tip: If you need a unique color combination for your footer, go to Color schemes in the powerbar to edit your color scheme’s background, type style, button, and accent colors, or create a dedicated scheme just for your footer.
Apply color schemes to library pages
You can apply color schemes to your library pages to maintain visual consistency across your media libraries and brand assets.
How to apply a color scheme to a library page:
Go to the library page you want to customize.
In edit mode, click on Themes in the powerbar.
Choose whether you want to apply changes to All libraries or This library.
Scroll to the Content area section.
Open the Color scheme dropdown menu and choose the color scheme you want to apply.
The selected color scheme will automatically apply its background color and type style settings across the library interface.
Control layout styling
Each section includes flexible layout styling options to ensure content remains legible, structured, and visually balanced when using different color schemes or background styles.
Available styling controls:
Adjust vertical spacing between sections to avoid visual clutter.
Customize horizontal and vertical padding for improved text alignment and breathing room.
Use background fit to align the background styling with your content layout.
Set corner radius to create smooth, rounded borders.
Add borders to establish clear structure or visual separation.
All of these controls can be configured for individual sections or defined as guideline-wide theme defaults.
Limitations on cover page styling
Cover pages support only the default color scheme. As a result:
Custom type styles
Button styles
Accent colors
Background colors from other color schemes
...will not apply to cover pages.
Additionally, cover pages do not automatically inherit background colors from your selected color scheme. If you want a background color on your cover page, configure it manually in the cover page settings.
Note: Cover pages are legacy pages and will be phased out in 2027. No new styling or color scheme capabilities will be added to them. If you are building a new homepage or require flexible color schemes and section styling, we recommend using a document page instead.
Import settings and color schemes from another guideline
To maintain consistency across your brand portals and save setup time, you can import existing design settings, including typography, buttons, and color schemes, from another guideline.
How to import settings:
Open the guideline where you want to apply the settings.
In edit mode, select Import settings from the powerbar.
Choose the brand and the source guideline whose settings you want to import.
Click Confirm to apply the configuration.
Your guideline will update with the imported styles, color schemes, and layout settings.
If you have any further questions, see Color schemes FAQs or contact Support.