Apply predefined colour schemes to modules in top-a, top-b, bottom-a, bottom-b via moduleclass_sfx — no CSS required.

How to Apply

  1. Open the module → Advanced tab
  2. Set Module Class Suffix to a preset (e.g. block-2)
  3. Save & Close, clear cache

Presets

SuffixBackgroundUse case
block-1Secondary surfaceStandard content
block-2Accent blueFeatured content
block-3Amber tintTips and notes
block-4Green tintPositive outcomes
block-highlightAccent primaryHighlight / pull-quote
block-ctaBrand navyCall to action
block-alertDanger redUrgent notices

Customising

:root[data-bs-theme='dark'] {{
  --block-color-2: #1a5c3a;
  --block-text-2:  #c3e6cb;
}}
:root {{
  --block-color-2: #d4edda;
  --block-text-2:  #155724;
}}
Tip: A leading space in moduleclass_sfx appends to default classes. Without it, it replaces them.