Skip to main content

Advanced Block Styling

Advanced Block Styling has been updated to give you clearer, more powerful control over how blocks look—without losing responsiveness.

Written by Steve Scott

The builder side panel is now split into two tabs:

  • Details (what the block is and what it shows)

  • Styles (how the block looks)

You can choose to keep styles linked across Mobile and Desktop or adjust them independently per breakpoint.

You’ll also find improved controls for image/video sizing (Auto vs Fixed), reorganized layout options like Fit and Width, plus new granular styling controls for borders, per-corner radius, shadows (position/blur/spread), position nudges, and per-side spacing.

You can also expand your design system by adding custom colors in addition to your preset brand palette, and an optional highlight font in addition to your brand fonts.


1) Details vs Styles — the new side panel tabs


Details tab (block configuration)

Use Details for the “what” of a block:

  • The block’s content and block-specific options

  • Media-specific options for blocks like Image and Video

Styles tab (visual controls)

Use Styles for the “how it looks” of a block:

  • Size, layout, and spacing controls

  • Borders, corner radius, and shadows

  • Positioning controls (nudge the element within its block)


2) Image & video sizing — Auto vs Fixed

Image and Video blocks now have clearer sizing behavior, with options that are easier to find.


Auto

Choose Auto when you want the media to size naturally based on the layout and container and its aspect ratio.


Fixed

Choose Fixed when you want a predictable size and control the height.


Fit and Width controls

Some controls like Fit and Width have been reorganized and moved into the most relevant tab/section so sizing controls are grouped together more logically.


3) Borders — add and style borders

You can now add borders and style them with more control.


What you can do

  • Turn a border on/off

  • Adjust border styling (for example: thickness and border appearance)

This makes it easier to create cards, frames, and outlined components that match your page’s visual system.


4) Corner radius — granular corner controls

Corner radius now includes more granular targeting


What you can do

  • Set radius for all corners or,

  • Fine-tune specific corners (for example: top-left vs bottom-right) which is useful for asymmetric designs, “Ticket” shapes or cards that need only top corners rounded, etc.



5) Shadows — position, blur, and spread

You can now add shadows with more detailed controls.

Shadow controls include

  • Position (where the shadow sits)

  • Blur (how soft it is)

  • Spread (how wide it grows)

This makes it easier to build depth consistently across your pages.



6) Position — nudge an element within its block


Position controls let you move an element within its block such as Move left / right or up / down (top / bottom)

Use this when you need a small alignment adjustment without changing the structure of the layout.


7) Custom Colours

Creators can now add custom colors on top of their preset brand colors.


What this means

  • Your brand palette is still available

  • You can add extra colors for specific pages, campaigns, or one-off designs

  • Custom colors can be used anywhere you choose a color in the builder



7) Font Override

In addition to your brand fonts set in your app settings, you can now override any text block with any other additional font.

When to use it

  • Callouts and emphasis text

  • Headings that need a different style

  • Campaign or special-event pages


8) Spacing — add padding with per-side control

You can now add additional spacing with the same kind of granular controls.

What you can do

  • Add spacing to top / bottom / left / right independently

This is especially helpful when:

  • You want consistent breathing room around content

  • You need to align blocks visually without adding extra spacer blocks


Tips & troubleshooting

“I can’t find a control I used before”

Controls may have been reorganized under Details (block-specific) or Styles (visual). If something isn’t where you expect, check the other tab.

“My media changed shape after switching sizing modes”

Auto and Fixed behave differently by design. If you need a predictable result, use Fixed.

“My border and corner radius don’t match what I expected”

If you have per-corner radius enabled, double-check that the corners you intend to round are the ones being edited.

Did this answer your question?