List Widget

Use the List widget to present features, steps, or benefits with icons and descriptions.

AI Generate and clean page imports can also return a List widget directly when a page brief or short checklist calls for repeated steps, benefits, or icon-and-label rows.

Add a List widget

List Settings

The dialog has two tabs: Layout and Style.

Layout tab

• Columns: set how many list items appear on mobile, tablet, and desktop. Desktop count maps to Single Column through Six Columns.
• Tablet Width: choose whether the list keeps its desktop width behavior or expands on tablet screens.
• Show Descriptions
• Icon Position: Inline with Heading, Inline with Item, Stacked
• Item Alignment: align item content left, center, or right inside each column.
• Stacked Alignment (when stacked)
• Gap Between Items
• Icon Size
• Circle Background with Padding and Circle Color

Style tab

• Item Background Color
• Text Color
• Icon Color
• Border, Border Radius, and Shadow

Editing list items

• Click item text to edit inline.
• Title and description editors expand while you type, which makes multi-line list content easier to edit directly on the canvas.
• Inline editing keeps the item background transparent, so you can see the saved list styling while you revise copy.
• Drag items to reorder.
• Use the toolbar add button to create more items.

Ask AI

Use Ask AI when you want to polish or expand the list without rebuilding it by hand.

• Improve: tighten wording and make the list read more consistently.
• Shorten or Lengthen: adjust detail level while keeping the same item count unless you ask otherwise.
• Add item: add one new list item that matches the current pattern.
• Custom prompt: ask AI to rewrite, add, remove, or replace list items.

List AI uses the surrounding row and page context to keep generated items aligned with the current section.

Toolbar actions

• List Settings
• Alignment
• Animation
• Position
• Copy
• Delete

For breakpoint and spacing checks, review Responsive Design.