Skip to content

Promise bar

Four cells across a hairline-ruled bar, each with an icon, a short heading and one line of explanation. Shipping, returns, run size, drop day — the four things a shopper checks before they trust an unfamiliar brand.

It is deliberately plain. The whole point is that it reads as fact, not as marketing.

SettingTypeDefaultWhat it does
Colour schemeSelect — Default / Light / DeepdefaultWhich ground the bar sits on.
Top spacingRange, 0–160 px48Top spacing.
Bottom spacingRange, 0–160 px48Bottom spacing.

Up to four blocks.

SettingTypeDefaultWhat it does
IconSelecttruckThe icon, drawn from the theme’s own set in the accent colour. Options: Shipping (truck), Returns (return), Tag (tag), Clock (clock), Shield (shield), Check (check), Mail (mail), Pin (pin), Star (star), No icon (none).
HeadingTextFree worldwide shippingThe claim, in bold at 14 px.
TextTextDispatched in one working day, tracked.One line of detail underneath. Leave it empty for a heading-only cell.

One preset, Promise bar, with the four cells a drop brand usually needs:

IconHeadingText
ShippingFree worldwide shippingDispatched in one working day, tracked.
Returns30-day returnsUnworn, with tags, free label in the box.
Tag400 units a runNothing is restocked, ever.
ClockDrops every Friday18:00, to the list first.

The bar is always four columns wide on desktop, whatever number of blocks you have. Three blocks leave an empty fourth column with a hanging divider. Use four, or drop to two — never three.

It is ruled, not boxed. A hairline above and below the bar, and a hairline between each cell, with the last divider suppressed. That is what lets it sit between two sections without looking like a card.

Responsive steps: two columns below 860 px (with the right-hand dividers and the top row’s bottom border adjusted so the grid stays clean), one column below 480 px.

Icons are a fixed set. You cannot upload one. If none of the nine fits, choose No icon — a cell with no icon lines up fine next to cells that have them.