Blocks / Logo Cloud
Logo Cloud beta
The wall of names, moving slowly — social proof at the speed of a conveyor belt.
Powering books for teams at
GitHub Slack Spotify YouTube Twitch LinkedIn Instagram X
Built from: Marquee — include their CSS alongside this block.
<section class="k-logoc" style="max-width:680px">
<p class="cap">Powering books for teams at</p>
<div class="k-marquee">
<div class="k-marquee-track">
<div class="k-marquee-group"><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.8a9.2 9.2 0 0 0-9.2 9.2c0 4.1 2.7 7.6 6.4 9 .5.1.6-.2.6-.4v-1.4c-2.6.6-3.1-1.2-3.1-1.2-.4-1.1-1-1.3-1-1.3-.9-.6.1-.6.1-.6.9.1 1.4.9 1.4.9.9 1.4 2.2 1 2.7.8.1-.6.3-1.1.6-1.3-2.1-.2-4.2-1-4.2-4.6 0-1 .4-1.8.9-2.5-.1-.2-.4-1.1.1-2.3 0 0 .8-.2 2.5.9a8.6 8.6 0 0 1 4.5 0c1.7-1.1 2.5-.9 2.5-.9.5 1.2.2 2.1.1 2.3.5.7.9 1.5.9 2.5 0 3.6-2.2 4.4-4.2 4.6.3.3.6.9.6 1.8v2.6c0 .2.2.5.6.4a9.2 9.2 0 0 0 6.4-9A9.2 9.2 0 0 0 12 2.8z"/></svg> GitHub</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5"/><path d="M9.5 8v8M14.5 8v8M8 9.5h8M8 14.5h8"/></svg> Slack</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M8 10.2c2.7-.8 5.5-.6 8 .7M8.2 13c2.2-.6 4.5-.4 6.5.6M8.4 15.7c1.8-.5 3.6-.3 5.2.5"/></svg> Spotify</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M21.6 7.1a2.8 2.8 0 0 0-2-2C17.9 4.7 12 4.7 12 4.7s-5.9 0-7.6.4a2.8 2.8 0 0 0-2 2A29 29 0 0 0 2 12a29 29 0 0 0 .4 4.9 2.8 2.8 0 0 0 2 2c1.7.4 7.6.4 7.6.4s5.9 0 7.6-.4a2.8 2.8 0 0 0 2-2A29 29 0 0 0 22 12a29 29 0 0 0-.4-4.9zM10 15.3V8.7L15.6 12 10 15.3z"/></svg> YouTube</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 2H3v16h5v4l4-4h5l4-4V2z"/><path d="M11 7v4M16 7v4"/></svg> Twitch</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm3.2 7.3H4.6V18h2.6v-7.7zM5.9 9.2a1.5 1.5 0 1 0 0-3.1 1.5 1.5 0 0 0 0 3.1zM18 18h-2.6v-3.7c0-1.2-.4-2-1.5-2-1.3 0-1.9.9-1.9 2V18H9.4v-7.7h2.6v1.1c.4-.7 1.3-1.3 2.6-1.3 2 0 3.4 1.3 3.4 3.9v4z"/></svg> LinkedIn</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.3" cy="6.7" r="0.4" fill="currentColor" stroke="none"/></svg> Instagram</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4 3l6.9 9.3L4.4 21h2.9l5-6.3 4 6.3H20l-7.2-9.7L19.4 3h-2.9l-4.4 5.6L8.4 3H4z"/></svg> X</span></div>
<div class="k-marquee-group" aria-hidden="true"><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2.8a9.2 9.2 0 0 0-9.2 9.2c0 4.1 2.7 7.6 6.4 9 .5.1.6-.2.6-.4v-1.4c-2.6.6-3.1-1.2-3.1-1.2-.4-1.1-1-1.3-1-1.3-.9-.6.1-.6.1-.6.9.1 1.4.9 1.4.9.9 1.4 2.2 1 2.7.8.1-.6.3-1.1.6-1.3-2.1-.2-4.2-1-4.2-4.6 0-1 .4-1.8.9-2.5-.1-.2-.4-1.1.1-2.3 0 0 .8-.2 2.5.9a8.6 8.6 0 0 1 4.5 0c1.7-1.1 2.5-.9 2.5-.9.5 1.2.2 2.1.1 2.3.5.7.9 1.5.9 2.5 0 3.6-2.2 4.4-4.2 4.6.3.3.6.9.6 1.8v2.6c0 .2.2.5.6.4a9.2 9.2 0 0 0 6.4-9A9.2 9.2 0 0 0 12 2.8z"/></svg> GitHub</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5"/><path d="M9.5 8v8M14.5 8v8M8 9.5h8M8 14.5h8"/></svg> Slack</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><circle cx="12" cy="12" r="9"/><path d="M8 10.2c2.7-.8 5.5-.6 8 .7M8.2 13c2.2-.6 4.5-.4 6.5.6M8.4 15.7c1.8-.5 3.6-.3 5.2.5"/></svg> Spotify</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M21.6 7.1a2.8 2.8 0 0 0-2-2C17.9 4.7 12 4.7 12 4.7s-5.9 0-7.6.4a2.8 2.8 0 0 0-2 2A29 29 0 0 0 2 12a29 29 0 0 0 .4 4.9 2.8 2.8 0 0 0 2 2c1.7.4 7.6.4 7.6.4s5.9 0 7.6-.4a2.8 2.8 0 0 0 2-2A29 29 0 0 0 22 12a29 29 0 0 0-.4-4.9zM10 15.3V8.7L15.6 12 10 15.3z"/></svg> YouTube</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M21 2H3v16h5v4l4-4h5l4-4V2z"/><path d="M11 7v4M16 7v4"/></svg> Twitch</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M4 3h16a1 1 0 0 1 1 1v16a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1zm3.2 7.3H4.6V18h2.6v-7.7zM5.9 9.2a1.5 1.5 0 1 0 0-3.1 1.5 1.5 0 0 0 0 3.1zM18 18h-2.6v-3.7c0-1.2-.4-2-1.5-2-1.3 0-1.9.9-1.9 2V18H9.4v-7.7h2.6v1.1c.4-.7 1.3-1.3 2.6-1.3 2 0 3.4 1.3 3.4 3.9v4z"/></svg> LinkedIn</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="3" width="18" height="18" rx="5"/><circle cx="12" cy="12" r="4"/><circle cx="17.3" cy="6.7" r="0.4" fill="currentColor" stroke="none"/></svg> Instagram</span><span class="li"><svg width="19" height="19" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M4 3l6.9 9.3L4.4 21h2.9l5-6.3 4 6.3H20l-7.2-9.7L19.4 3h-2.9l-4.4 5.6L8.4 3H4z"/></svg> X</span></div>
</div>
</div>
</section>.k-logoc{font-family:var(--k-font);text-align:center;color:var(--k-ink)}
.k-logoc .cap{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--k-ink-3);font-weight:600;margin-bottom:18px}
.k-logoc .li{display:inline-flex;align-items:center;gap:9px;font-size:14.5px;font-weight:600;color:var(--k-ink-2);white-space:nowrap}
Usage
Under the hero or above the footer. Motion earns attention the static grid spends; pause on hover is built into the Marquee part it rides on.