Badge Row

A row of guarantee and trust badges: only claims you can actually honor, each one config-driven.

Copied 0 times.

🛡Secure checkout↩Free returns🚚Fast shipping✓Money-back

Members only

This design needs a membership.
Today's price: $1/month, locked forever once you join.

Get it for $1/month Log in

Build a trust badge row for my website. Match my existing design system, colors, and fonts.

STRUCTURE
- A horizontal row of evenly spaced badges, centered, with comfortable gaps; on mobile the row wraps to two lines gracefully.
- Four badges, e.g. secure checkout, free returns, fast shipping, money-back guarantee (placeholders with a TODO for my real policies).
- Each badge is an icon with its short label beside or under it (2-4 words, e.g. "Free 30-day returns").
- Icons are inline SVG (shield, lock, truck, rotate-back arrow, credit card...), consistent stroke weight, sized 20-24px, in a single muted color or my accent color, never a rainbow of styles.

DATA AND HONESTY
- Badges live in one config array (icon key, label text, optional link URL); render only entries I filled in, and the whole row does not render when the array is empty.
- A clearly marked TODO reminds me: every badge is a claim. "30-day returns" requires that my store honors 30-day returns; "Secure checkout" requires actual TLS and a real payment processor. Never ship a badge for a policy that does not exist, and never imitate specific certification logos (Norton, McAfee, BBB) without holding the certification.

BEHAVIOR
- Purely static by default; a badge with a link URL becomes an anchor to the relevant policy page (returns policy, security page) in the same tab.
- No animation; trust elements should feel stable, not busy.

QUALITY
- Semantic markup: a ul with li per badge; linked badges are anchors with descriptive accessible names.
- Icons are aria-hidden; the visible label carries the meaning. Text meets WCAG AA contrast even in the muted style.
- The row adds no layout shift: fixed icon boxes, text wrapping handled by the flex layout.

QUESTIONS
- Before you build, find or ask for: which policies are actually true for my business (returns, shipping, guarantees, support hours) and the policy page URLs. Check my project and site first; whatever you cannot find there, ask me for. Never invent these or ship placeholders.
- If anything else about my brand or content is unclear, ask me before inventing.

Members only

What it does

The badge row is the quiet line of reassurances near your buy button: secure checkout, free returns, fast shipping. Tiny promises that lower the pulse right when someone's about to pay. They work because they answer worries nobody says out loud.

Every badge is a claim you must actually honor; a returns badge requires a returns policy, and the code says so.
Imitating official certification logos you don't hold is banned.
A badge can link to the policy page that backs it up, opening right there in the same tab.
Icons stay one consistent style and color, never a rainbow of mismatched clip art.
The words carry the meaning; the icons just decorate them.
On phones the row wraps to two tidy lines instead of squeezing.
No animation, ever; trust should feel stable, not busy.

How it works

1Pick how many badges, 3, 4, or 5.
2Pick the style, icons with labels, or icons alone where their meaning is obvious.
3Copy the prompt, one block that tells your AI the whole job, into whichever AI you use.
4Write your real promises into the marked list, and link each badge to the policy page that backs it, if you have one.
5Audit the row once a season: for every badge, ask can we actually honor this today? Remove any no, immediately.
6Squeeze your browser narrow: the row should wrap gracefully, every badge still readable, nothing clipped.

What you can customize

How many badges: three reads at a glance; five suits stores with genuinely lots to promise, spaced a little tighter.
Badge style: icons plus text is safest; icons only works when the symbols are unmistakable, with the label still whispered to screen readers.
Icons and colors adapt to your site automatically, because your AI builds the row right inside your own design, one icon family throughout.

You'll also like

Pick a box, win a prize

Try it: pick a box. The prize is drawn by weight before it opens.

Gift Box Reveal

Pick a box, get a prize drawn from your real weighted odds. The pick is theater; the draw is honest.

iHow this works

Note Box

A calm callout block for the things readers need to know: how it works, why to trust you, what to watch for.

$4.2M

Client revenue

1,200+

Customers

Countries

310

Industries

Stats Proof Grid

A wall of your biggest real numbers: revenue, customers, countries. Let the numbers do the talking.