← Visual Library / Trust bands

Guarantee / trust band

A single dark section in the middle of a cream page. The "trust vault" moment.

Trust bands Built JS-free
Use when — you have a real, specific guarantee to anchor on. The visual weight only earns its keep if there's substance behind it. Don't dilute by making other middle sections dark — this band is the only one between hero and footer.

Live demo

(cream section above)
My guarantee

I work on your project until it's perfect.

Unlimited revisions within scope. No "extra hour" charges.

(cream section below)

The structure

<section class="guarantee">
  <span class="g-eyebrow">My guarantee</span>
  <h2>I work until it's <em>perfect.</em></h2>
  <p>Unlimited revisions within scope.</p>
  <svg><!-- shield + checkmark --></svg>
</section>

The four ingredients

1) Dark background. 2) Gold eyebrow + italic emphasis (premium identity ties to trust). 3) Shield SVG (visual weight without imagery). 4) Tight copy: one promise, one supporting line. More than this dilutes.

Code playbook: vault/Topics/web-patterns.md § Pattern 15 (Garantía / trust band).