Skip to content

Section Block

Section

The Section block is a flexible wrapper for headings and inner content, with full spacing, alignment, height, and colour controls.

What It Includes

  • Heading
  • Inner content (any blocks)

Layout Controls

  • Inner spacing (Top/Bottom): Small / Medium / Large
  • Inner spacing (Left/Right): Small / Medium / Large
  • Content alignment: Left / Center / Right
  • Top margin: Use global / None / Small / Medium / Large
  • Bottom margin: Use global / None / Small / Medium / Large
  • Height (Mobile): Auto / Small (20rem) / Medium (30rem) / Large (40rem)
  • Height (Desktop): Auto / Small (20rem) / Medium (30rem) / Large (40rem)
  • Centre content vertically: (only when a fixed height is set)

Typography Controls

  • Heading tag: H1 / H2 / H3
  • Heading size: Theme default, XL → 4XL
  • Body size: Theme default, Small → 3XL

Colour Controls

  • Heading text
  • Body text
  • Background

Tips

Use Section for custom layouts and nested blocks.

If you want a hero‑style container, set a fixed height and enable Center content vertically.

BBI Brandboost
Privacy Overview

This website uses cookies so that we can provide you with the best user experience possible. Cookie information is stored in your browser and performs functions such as recognising you when you return to our website and helping our team to understand which sections of the website you find most interesting and useful.