---
title: "Builder Presets"
date: "2025-11-11T11:51:39+00:00"
summary: "Create and apply custom styling presets for emails and landing pages to ensure brand consistency and streamline content creation."
image:
type: "page"
url: "/campaign-studio/builder-presets"
id: "1b83e819-3953-4fae-a953-11bd0efe1323"
---

Table of contents will be added

The Builder Presets feature in Campaign Studio enables marketers to create, save, manage, and apply default styling and reusable content configurations when building emails and landing pages. Presets are predefined settings for content blocks such as buttons, text, and images that can be quickly applied when creating or editing emails and landing pages. They allow you to maintain consistent styles and configurations across multiple assets. They ensure brand consistency, streamline content creation, and reduce build time.

Creating builder presets
------------------------

To create a builder preset, do the following:

1.  Log in to your Campaign Studio instance.
2.  In the upper right corner, click the **Settings** gear icon to expand the menu.
3.  Click the **Builder Presets** tab.
    
    Campaign Studio displays the Builder Presets list page.
    
4.  Click **\+ New**.
5.  Configure the following fields on the New Builder Presets page:
    1.  **Name**: Enter a name for the preset.
    2.  **Alias**: Leave this field blank as system generates a unique alias based on the name if this field remains empty. It is an alphabetical string used for URL generation of the preset.
    3.  **Published**: Set the **Yes/No** toggle bar to publish or unpublish a preset.
6.  Configure the [additional fields](#new-builder-presets-fields) on the New Builder Presets page.
7.  Click **Save & Close**.

New Builder Presets field descriptions
--------------------------------------

Note

*   Color values: Must be in HEX or RGB format. For RGB, the values must range from 0 to 255.
*   CSS units: Supported units include px, em, rem, %, vw, vh. For example, 600px, 100%.

All fields are optional. However, at least one field must be completed to create a valid preset.  

### H1

**Field**

**Description**

**H1 Color**

*   Sets the text color for H1 heading elements.
*   Accepts color in HEX or RGB format.

**H1 Font Size**

*   Defines the font size for H1 heading elements.
*   Accepts numeric values with CSS units.

**H1 Font Family**

*   Sets the font family for H1 heading elements.
*   Accepts one of the configured font families from the system’s editor fonts.

**H1 Font Weight**

*   Defines the font weight (boldness) for H1 heading elements.
*   Accepts the values Extra-light, Light, Regular, Medium, Semi-bold, and Bold.

**H1 Link Color**

*   Sets the color for hyperlinks in H1 heading elements.
*   Accepts color in HEX or RGB format.

**H1 Text Align**

*   Defines the horizontal alignment for H1 heading elements.
*   Accepts the values left, center, right, and justify.

**H1 Direction**

*   Sets the text direction for H1 heading elements.
*   Accepts the values ltr (left to right) and rtl (right to left).

**H1 Letter Spacing**

*   Controls the spacing between letters in H1 heading elements.
*   Accepts numeric values with CSS units.

### H2

**Field**

**Description**

**H2 Color**

*   Sets the text color for H2 heading elements.
*   Accepts color in HEX or RGB format.

**H2 Font Size**

*   Defines the font size for H2 heading elements.
*   Accepts numeric values with CSS units.

**H2 Font Family**

*   Sets the font family for H2 heading elements.
*   Accepts one of the configured font families from the system’s editor fonts.

**H2 Font Weight**

*   Defines the font weight (boldness) for H2 heading elements.
*   Accepts the values Extra-light, Light, Regular, Medium, Semi-bold, and Bold.

**H2 Link Color**

*   Sets the color for hyperlinks in H2 heading elements.
*   Accepts color in HEX or RGB format.

**H2 Text Align**

*   Defines the horizontal alignment for H2 heading elements.
*   Accepts the values left, center, right, and justify.

**H2 Direction**

*   Sets the text direction for H2 heading elements.
*   Accepts the values ltr (left to right) and rtl (right to left).

**H2 Letter Spacing**

*   Controls the spacing between letters in H2 heading elements.
*   Accepts numeric values with CSS units.

### H3

**Field**

**Description**

**H3 Color**

*   Sets the text color for H3 heading elements.
*   Accepts color in HEX or RGB format.

**H3 Font Size**

*   Defines the font size for H3 heading elements.
*   Accepts numeric values with CSS units.

**H3 Font Family**

*   Sets the font family for H3 heading elements.
*   Accepts one of the configured font families from the system’s editor fonts.

**H3 Font Weight**

*   Defines the font weight (boldness) for H3 heading elements.
*   Accepts the values Extra-light, Light, Regular, Medium, Semi-bold, and Bold.

**H3 Link Color**

*   Sets the color for hyperlinks in H3 heading elements.
*   Accepts color in HEX or RGB format.

**H3 Text Align**

*   Defines the horizontal alignment for H3 heading elements.
*   Accepts the values left, center, right, and justify.

**H3 Direction**

*   Sets the text direction for H3 heading elements.
*   Accepts the values ltr (left to right) and rtl (right to left).

**H3 Letter Spacing**

*   Controls the spacing between letters in H3 heading elements.
*   Accepts numeric values with CSS units.

### Title 

**Field**

**Description**

**Align**

*   Defines the horizontal alignment for title elements.
    
*   Accepts the values left, center, right, and justify.
    

**Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units. 
    

**Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units. 
    

**Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units. 
    

**Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

### General

Field 

Description

**Background Color**

*   Sets the overall background color for the template.
*   Accepts color in HEX or RGB format.

**Content Area Background Color**

*   Sets the background color for the main content area of the template.
*   Accepts color in HEX or RGB format.

**Content Area Width**

*   Defines the width of the main content area in the template.
*   Accepts numeric values with CSS units.

**Default Font**

*   Sets the default font family to be used throughout the template.
*   Accepts one of the configured font families from the system's editor fonts.

**Link Color**

*   Sets the default color for hyperlinks throughout the template.
*   Accepts color in HEX or RGB format.

### Text

**Field**

**Description**

**Text HTML**

*   Sets the default HTML content for text blocks.
    
*   Accepts any valid HTML text content.
    

**Text Color**

*   Sets the default text color for text blocks.
    
*   Accepts color in HEX or RGB format.
    

**Text Link Color**

*   Sets the color for hyperlinks within text blocks.
    
*   Accepts color in HEX or RGB format.
    

**Text Font Size**

*   Defines the default font size for text blocks.
    
*   Accepts numeric values with CSS units. 
    

**Text Font Family**

*   Sets the font family for text blocks.
    
*   Accepts one of the configured font families from the system’s editor fonts.
    

**Text Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units. 
    

**Text Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units. 
    

**Text Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units. 
    

**Text Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units. 
    

### Image 

**Field**

**Description**

**Image Border Radius**

*   Sets the default border radius for image blocks to create rounded corners.
    
*   Accepts numeric values with CSS units.
    

**Image Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Image Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Image Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Image Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

**Image Align**

*   Sets the default horizontal alignment for image blocks.
    
*   Accepts the values left, center, and right.
    

### Row 

**Field**

**Description**

**Row Background Color**

*   Sets the background color for row blocks.
    
*   Accepts color in HEX or RGB format.
    

**Row Content Area Background Color**

*   Sets the background color for the content area within row blocks.
    
*   Accepts color in HEX or RGB format.
    

**Row Column Border Radius**

*   Sets the border radius for columns within row blocks to create rounded corners.
    
*   Accepts numeric values with CSS units.
    

**Row Columns Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Row Columns Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Row Columns Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Row Columns Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

**Row Columns Background Color**

*   Sets the background color for columns within row blocks.
    
*   Accepts color in HEX or RGB format.
    

### Button 

**Field**

**Description**

**Button Color**

*   Sets the text color for button blocks.
    
*   Accepts color in HEX or RGB format.
    

**Button Font Size**

*   Defines the font size for button text.
    
*   Accepts numeric values with CSS units.
    

**Button Font Family**

*   Sets the font family for button text.
    
*   Accepts one of the configured font families from the system’s editor fonts.
    

**Button Background Color**

*   Sets the background color for button blocks.
    
*   Accepts color in HEX or RGB format.
    

**Button Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Button Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Button Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Button Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

**Button Block Padding Top**

*   Defines the default top padding for button blocks.
    
*   Accepts values with CSS units.
    

**Button Block Padding Right**

*   Defines the default right padding for button blocks.
    
*   Accepts values with CSS units.
    

**Button Block Padding Bottom**

*   Defines the default bottom padding for button blocks.
    
*   Accepts values with CSS units.
    

**Button Block Padding Left**

*   Defines the default left padding for button blocks.
    
*   Accepts values with CSS units.
    

**Button Align**

*   Sets the horizontal alignment for button blocks.
    
*   Accepts the values left, center, and right.
    

**Button Border Radius**

*   Sets the default border radius for button blocks to create rounded corners.
*   Accepts values with CSS units.

### Divider 

**Field**

**Description**

**Divider Line**

*   Sets the default styling for divider lines including width, style, and color.
    
*   Accepts the format `width style color`.
    

**Divider Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Divider Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Divider Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Divider Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

### Social 

**Field**

**Description**

**Social Align**

*   Sets the horizontal alignment for social media blocks.
    
*   Accepts the values left, center, right.
    

**Social Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Social Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Social Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Social Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

### Icons Block 

**Field**

**Description**

**Icons Color**

*   Sets the color for icon elements.
    
*   Accepts color in HEX or RGB format.
    

**Icons Align**

*   Sets the horizontal alignment for icon blocks.
    
*   Accepts the values left, center, right.
    

**Icons Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Icons Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Icons Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Icons Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

**Icons Item Spacing**

*   Controls the spacing between individual icon items.
    
*   Accepts numeric values with CSS units.
    

**Icons Size**

*   Defines the overall size for icons.
    
*   Accepts numeric values with CSS units.
    

**Icons Spacing Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Icons Spacing Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Icons Spacing Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Icons Spacing Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

### Spacer 

**Field**

**Description**

**Spacer Height**

*   Sets the default height for spacer blocks used to create vertical spacing.
*   Accepts numeric values with CSS units.

### Paragraph 

**Field**

**Description**

**Paragraph Color**

*   Sets the text color for paragraph blocks.
    
*   Accepts color in HEX or RGB format.
    

**Paragraph Font Size**

*   Defines the font size for paragraph text.
    
*   Accepts numeric values with CSS units.
    

**Paragraph Font Family**

*   Sets the font family for paragraph text.
    
*   Accepts one of the configured font families from the system’s editor fonts.
    

**Paragraph Font Weight**

*   Defines the font weight for paragraph text.
    
*   Accepts the values Extra-light, Light, Regular, Medium, Semi-bold, and Bold.
    

**Paragraph Line Height**

*   Controls the line height for paragraph text.
    
*   Accepts numeric values, percentages, CSS units, or keywords.
    

**Paragraph Text Align**

*   Defines the horizontal alignment for paragraph text.
    
*   Accepts the values left, center, right, and justify.
    

**Paragraph Direction**

*   Sets the text direction for paragraph content.
    
*   Accepts the values left and right.
    

**Paragraph Letter Spacing**

*   Controls the spacing between letters in paragraph text.
    
*   Accepts numeric values with CSS units.
    

**Paragraph Link Color**

*   Sets the color for hyperlinks within paragraph blocks.
    
*   Accepts color in HEX or RGB format.
    

**Paragraph Spacing**

*   Defines the spacing between paragraph elements.
    
*   Accepts numeric values with CSS units.
    

**Paragraph Block Padding Top**

*   Defines the default top padding.
    
*   Accepts values with CSS units.
    

**Paragraph Block Padding Right**

*   Defines the default right padding.
    
*   Accepts values with CSS units.
    

**Paragraph Block Padding Bottom**

*   Defines the default bottom padding.
    
*   Accepts values with CSS units.
    

**Paragraph Block Padding Left**

*   Defines the default left padding.
    
*   Accepts values with CSS units.
    

Using builder presets
---------------------

Builder Presets can be applied to emails and landing pages.

### Using builder presets in emails

To apply a preset to an email, do the following:

1.  Log in to your Campaign Studio instance.
2.  In the left navigation pane, click **Channels** > **Emails**.
3.  Click **\+ New**.
4.  Select either the New Template Email type or the New Segment Email type.
5.  In the configuration form on the right, locate the **Builder Presets** dropdown.
6.  Select the name of the builder preset that you want to apply to the email.

For more information, visit [Email basics](/campaign-studio/email-basics "Email basics").

### Using builder presets in landing pages

To apply a preset to a landing page, do the following:

1.  Log in to your Campaign Studio instance.
2.  In the left navigation pane, click **Components** > **Landing pages**.
3.  Click **\+ New**.
4.  In the configuration form on the right, locate the **Builder Presets** dropdown.
5.  Select the name of the builder preset that you want to apply to the landing page.

For more information, visit [Landing page basics](https://Landing Page Basics).

Builder Presets list page
-------------------------

The Builder Presets list page provides the list of presets in your Campaign Studio instance. 

To access this page, do the following:

1.  Log in to your Campaign Studio instance.
2.  In the upper right corner, click the **Settings** gear icon to expand the menu.
3.  Click the **Builder Presets** tab.
    
    Campaign Studio displays the Builder Presets list page with the following information for each preset:
    
    Column
    
    Description
    
    NAME
    
    The name of the builder preset.
    
    ALIAS
    
    The alias of the builder preset.
    
    DATE ADDED
    
    The date when the builder preset is created.
    
    IS USED
    
    **YES**/**NO** indications to indicate if the builder preset is used for an email or landing page.
    
    ID
    
    The ID of the message indicating the position at which the builder preset is created in Campaign Studio. For example, an ID of 4 indicates that it is the fourth builder preset that is created in Campaign Studio.
    
    The dropdown list for each builder preset contains the following options:
    
    *   **Edit**: To edit the builder preset.
    *   **Clone**: To clone the builder preset.
    *   **Delete**: To delete the builder preset.

Note

When editing a builder preset, any changes to a preset do not retroactively update content where the preset is used.

The header row of the table contains a **Select All** checkbox that can be used to select and bulk delete the builder presets.

*   **Search**: The Search option before the table helps you to search for a builder preset in the list using filters.
*   **+New**: The **+New** button at the upper-right corner of the page helps you to create a new builder preset.