Skip to content

Logo cloud embed

Showcase auth communities on your site with an embeddable logo cloud. Each logo shows a hover tooltip with member count, genesis date, and recent activity.

Preview

Communities appear as logos (Google, Twitter, wallet providers, etc.). Hover reveals stats; a Get started CTA links to Canopi.

Option 1 — iframe

html
<iframe
  src="https://api.canopi.live/embed/logo-cloud.html"
  width="100%"
  height="320"
  frameborder="0"
  style="border-radius: 16px;"
></iframe>

Option 2 — Script tag

html
<div id="canopi-logo-cloud"></div>
<script
  src="https://api.canopi.live/embed/logo-cloud-embed.js"
  data-api-base="https://api.canopi.live"
  data-cta-url="https://app.canopi.live"
></script>

iframe URL parameters

ParamDescription
apiBaseAPI base URL (default: current origin)
ctaUrlCTA button link (default: https://canopi.live)

Example:

https://api.canopi.live/embed/logo-cloud.html?ctaUrl=https://app.canopi.live

Stats API

http
GET /api/auth-communities/stats

Response:

json
{
  "communities": [
    {
      "id": "uuid",
      "name": "GoogleAuth",
      "authProvider": "google",
      "logoUrl": "/assets/auth-logos/Google.svg",
      "memberCount": 42,
      "genesisDate": "2025-03-01",
      "last24h": 5,
      "acceptingCouncilNominations": true
    }
  ]
}
FieldDescription
genesisDateDate community reached 3 members (YYYY-MM-DD)
last24hMessages in the last 24 hours
acceptingCouncilNominationstrue when memberCount >= 10

Styling

Logos use white fill SVGs designed for dark backgrounds. Wrap in a dark container for best results:

html
<div style="background:#0f172a;padding:2rem;border-radius:16px;">
  <!-- iframe or script embed here -->
</div>

Canopi — Metaweb coordination layer for community-aware presence and messaging.