Logo cloud

Sections logos

A row of customer / partner logos.

Markup

Drops in as data-pb-block="logos".

html

<section data-pb-block="logos" class="pb-logos" style="padding:3rem 1.5rem;text-align:center;">
  <p class="pb-logos__caption" style="color:#64748b;margin:0 0 1.5rem;">Trusted by teams at</p>
  <div class="pb-logos__row" style="display:flex;flex-wrap:wrap;gap:2.5rem;justify-content:center;align-items:center;color:#94a3b8;font-weight:700;font-size:1.25rem;">
    <span>Acme</span><span>Globex</span><span>Initech</span><span>Umbrella</span><span>Soylent</span>
  </div>
</section>

Settings

Everything a block can be configured to do:

Bind to State: Drive content reactively from a State with declarative Alpine — x-text, x-show or x-model over $store.app.<stateKey>.
On event → run a Flow: Wire an interaction to a Flow: set data-pb-flow="<slug>" and data-pb-flow-event="click|submit|hover|change|…". The flow's returned actions update the page.
Link to a page: Navigate to another published page on click with data-pb-page="<slug>".
Styles & classes: Edit spacing, colour and layout visually in the GrapesJS editor. The wrapper carries data-pb-block="logos" so it imports as a labelled, editable component.