Every content block now lets you adjust vertical padding and width, and add a background color or image. Use Change design to control all three — vertical padding and width under the Format tab, background color or image under the Background tab — on a per-block basis.
Format
Every content block comes with built-in vertical padding and a set width. With Change design, you can adjust both on a per-block basis — giving important content more breathing room or extra width when it needs to stand out, or tightening things up to keep a page compact, without resorting to workarounds like empty text blocks or resized images.
Change the vertical padding of a block
Hover over any content block.
Click Change design in the left-side block toolbar.
In the panel that opens, go to the Format tab.
Under Vertical padding, choose a size:
S — 20 px (default, matches current spacing)
M — 40 px
L — 60 px
Change the width of a block
Hover over any content block.
Click Change design in the left-side block toolbar.
In the panel that opens, go to the Format tab.
Under Width, choose a size:
S
M
L
Your choices apply to the block immediately.
Best practices
Best practices
Use L padding to create separation. Add more space above and below a block that introduces a new idea or section.
Use S padding for dense pages. Keep the default when you want to fit more content without scrolling.
Mix paddings on one page. Combining sizes can help guide the learner’s eye and create visual hierarchy.
Use a narrower width for text-heavy blocks. A narrower column is easier to read for long passages.
Use a wider width for tables, images, or side-by-side content. Extra room helps content that needs more horizontal space.
Notes:
Padding and width is saved per block, so different blocks on the same page can each have their own setting.
Existing blocks keep their current spacing and width (S) until you change them — no visual change to existing courses.
Background
Add a color or image behind any content block to make it stand out, separate sections visually, or reinforce your course’s branding. With Change design, you can apply a background to the block only or stretch it across the full width of the page.
Add a background color or image to a block
Hover over any content block.
Click Change design in the left-side block toolbar.
In the panel that opens, click the Background tab.
The "None" option will be selected by default, but you will be able to:
Add a color: you can apply it to the content block only, or to the full width. If it’s contained to the block, you can also round the corners.
Color: choose one of the course theme’s suggested branded colors, or enter your company’s specific color using its RGB code in the custom color picker.
Width: Contained (block only) or Full (full width of the course)
Corner radius (contained only): you can choose between:
None (0 px)
S (8 px)
M (16 px)
L (24 px)
Add an image: you can apply it to the content block only or the full width of the course, round the corners, and even add an overlay.
Add image: Click here to upload the image from your PC, Choose from library, or select one from our Stock library.
Once your image is added, you can either change or edit it directly:
Click on Edit image to:Zoom the image and drag it to the desired placement
Fill in the available area
Set the image alignment
Blur image areas
Click on Change image to:Upload a new one from your PC
Choose one from the course media library
Select one from our Stock library
Generate it with EasyAI
Overlay: add a black or white overlay on top of the image and adjust its opacity from 0–100% — useful for keeping text legible over busy images
Width: Contained (block only) or Full (full width of the course)
Corner radius: you can choose between:
None (0 px)
S (8 px)
M (16 px)
L (24 px)
Best practices
Best practices
Use full width for section breaks. A full-width background helps signal a shift to a new topic or idea on the page.
Use contained backgrounds to spotlight content. A colored or rounded block draws the eye to a tip, callout, or key takeaway.
Add an overlay over busy images. A dark overlay works well with light text, and a light overlay works well with dark text. Use this whenever text sits on top of an image.
Keep corner radius consistent. Reusing the same radius across a course keeps the design cohesive.
Use your brand color for a consistent look. Enter your company’s RGB code once, and reuse it across blocks and courses.
Don’t overdo it. Reserve backgrounds for the blocks that need emphasis, using them on every block reduces their impact.












