Skip to main content

Letter Spacing Settings in Guidelines

This article outlines where letter spacing lives, how to configure it correctly, and known limitations.


Where Letter Spacing Can Be Configured

Type styles: Letter spacing is available within type styles (such as H1, H2, Body, and custom styles) in the guidelines design settings. To adjust letter spacing, select the paintbrush icon in the power bar and navigate to the Typography section. Select each type style individually to adjust letter spacing and other properties.

Header settings: Letter spacing and line height can be adjusted in the header settings for better readability and design consistency by going to ThemesLayout and navigationHeader.

Best Practices

Guidelines Type Styles

Negative values for letter spacing are supported in individual type styles. Previously, only positive values were possible — this was extended as a platform improvement.

Keep letter spacing values intentional and brand-consistent. Define letter spacing at the type style level so it applies consistently across the guidelines, rather than overriding it at the block level.

Note: Letter spacing is not currently available for button text styles — it exists in regular type styles but not in the button type style section. This is a known limitation. If this is important for your brand, submit a feature request through support.

Header and Theme Settings

Adjusting letter spacing and line height in the header settings can help resolve display issues across different browsers.

Typography inherits global text styles, including letter spacing. In certain blocks — such as the color content block — larger letter spacing values can cause text to be truncated. If truncation occurs, consider reducing letter spacing.

Supported units for letter spacing:

  • px (pixels) — for absolute spacing, such as 2px or -1px

  • em — for spacing relative to the font size, such as 0.05em

  • rem — for spacing relative to the root font size

For tighter letter spacing, use a negative value — for example, -0.5px or -0.02em brings characters closer together.


FAQs

Can letter spacing be set for button text styles? Letter spacing is not available for button text styles — it exists in regular type styles but not in the button type style section. This is a known platform limitation. To request this feature, contact support.

Why is text being cut off in a color content block? Larger letter spacing values inherited from global text styles can cause truncation in the color content block. Reducing letter spacing values or switching to a newer theme may resolve this.

Where is letter spacing found in the guidelines settings? Select the paintbrush icon in the power bar, and navigate to the Typography section. Select each type style individually to view and adjust letter spacing, line height, font size, and other properties.

Did this answer your question?