2 variants

Logo Marquee

A row of logos scrolling forever, faded at both ends, that stops whenever nobody is reading it.

Logo marquee

A row of logos scrolling forever, faded at both ends, that stops whenever nobody is reading it.

NorthlineVeraHalcyonEmber & CoFenwickSolsticeArgonPortage

usage.tsx

import { LogoMarquee } from "@/components/registry/logo-marquee";

export function TrustedBy() {
  return (
    <LogoMarquee duration={70}>
      {companies.map((name) => (
        <span key={name} className="text-lg font-semibold">
          {name}
        </span>
      ))}
    </LogoMarquee>
  );
}

"use client";

import { Fragment, type ReactNode, useEffect, useLayoutEffect, useRef, useState } from "react";
import { cn } from "@/lib/utils";

export interface LogoMarqueeProps {
  /** The logos, or anything else, to scroll. */
  children: ReactNode;
  /** Seconds for one full pass. Default 70. A logo row is background, so it wants to be slow enough to ignore. */
  duration?: number;
  /** Which way the row travels. Default "left". */
  direction?: "left" | "right";

122 more lines ship with an easeUI Pro license.

Buy a license

Install

$ bunx --bun shadcn add @easeui-pro/logo-marquee

Logo cloud

Every logo at once in a grid of hairline cells. Pointing at one brings it forward while the rest step back.

Trusted by teams at

usage.tsx

import { LogoCloud } from "@/components/registry/logo-cloud";

export function TrustedBy() {
  return (
    <LogoCloud
      label="Trusted by teams at"
      items={[{ name: "Northline", logo: <NorthlineLogo />, href: "https://northline.com" }]}
    />
  );
}

"use client";

import type { ReactNode } from "react";
import { cn } from "@/lib/utils";

export interface LogoCloudItem {
  /** Read by a screen reader, and shown as a wordmark when there is no logo. */
  name: string;
  /** An SVG or image for the mark. Without one, the name is set as a wordmark. */
  logo?: ReactNode;
  href?: string;
}

67 more lines ship with an easeUI Pro license.

Buy a license

Install

$ bunx --bun shadcn add @easeui-pro/logo-cloud