Change a section's layout, background and animation

Change spacing, columns and alignment

1. Right-click the section and click edit style.
2. Open Section to set v-size, the space above and below, and h-size, the width.
3. Open Texts Box for alignment, width and button placement, or Grid for columns and gaps.
4. For cards, open Card, or Items then Card, for size, shadow, border and Hover effect.

Changes save on their own. If a control is missing, turn on Advanced mode.

Add a background

1. In Section, click the bg image thumbnail to pick an image, or pick a bg video.
2. Or pick a Bg Color from your theme swatches or a custom color.
3. Add an Overlay to keep text readable over an image or video.

Animate a section

1. Open Texts Box, Grid or Media Box and pick an Animation, such as Fade Up, Scale In or Word Reveal.
2. Pick a Trigger: On Scroll or On Load.
3. In Advanced mode, set the duration, delay and Stagger, or use Per-element overrides for the title, subtitle, description and buttons.

Make a whole card clickable

In the same Card group, turn on Clickable. The whole card links to its first button's URL. Turn on Hide button to remove the visible button.

Limits

• Each section type shows its own style groups.
• Custom CSS and exact pixel padding aren't available. Spacing uses your theme's steps.
• Sticky works only on header sections.
• Background videos don't play under 768 px, with data saver on, or with reduced motion. The bg image shows instead.
• The background color doesn't show behind a background image.
• Animations work on text boxes, grids and media boxes. Visitors who turn on reduced motion see none.
• Backgrounds, colors and animations are the same on every screen size. Spacing, alignment and columns can differ. See Style pages for mobile, tablet and desktop.

Common questions

What does "Invalid color format" mean?

The color code isn't valid. Use a hex code such as #5b5bd6.

How do I undo a style change?

Press Cmd+Z, or Ctrl+Z on Windows.

Can Pixel restyle a section?

Yes. Ask, for example "Give the pricing section a light gray background". Pixel changes only that section in your draft.