Logo Cloud Base

Fetch pattern JSON: curl https://webspire.de/patterns/logo-cloud/base.json

base.html

<section class="ws-logo-cloud border-y border-[var(--ws-color-border)] bg-[var(--ws-logo-cloud-bg)] py-12">
  <div class="mx-auto max-w-7xl px-6">

    <p class="text-center text-xs font-semibold uppercase tracking-[0.15em] text-[var(--ws-logo-cloud-text-muted)]">Trusted by teams at</p>

    <div class="mt-8 flex flex-wrap items-center justify-center gap-x-10 gap-y-6">
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Vercel</span>
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Stripe</span>
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Linear</span>
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Notion</span>
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Figma</span>
      <span class="text-lg font-bold tracking-tight text-[var(--ws-color-text)] opacity-40 transition-opacity duration-200 hover:opacity-70">Resend</span>
    </div>

  </div>
</section>

Details

Family

logo-cloud

Tier

base

Kind

section

Responsive Dark Mode Tailwind Only SSR Safe Copy & Paste

Stable Published

logo-cloudtrust-barsocial-proofpartnerslanding-page

Slots

Name	Required	Description
headline	No	Trust statement above logos.
logos	Yes	Row of partner/client logos or brand names.

Minimal trust bar with placeholder brand names. Replace text spans with actual SVG logos for production. Place directly below the hero section for maximum trust impact.