dsphoebe

Infinite Logo Marquee

Component

About

Two logo rows drift in opposite directions, with a shallow perspective and a soft depth of field.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Infinite Logo Marquee to your project and fits it to your theme.

Code

How Infinite Logo Marquee is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

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

export default function Default() {
  return (
    <div className="dark relative flex min-h-screen items-center overflow-hidden bg-[#07080c] text-[#f4f6f8]">
      <div
        aria-hidden
        className="pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_72%_46%_at_50%_50%,rgba(132,164,220,0.16),transparent_70%)]"
      />
      <LogoMarquee className="relative w-full" size="lg" />
    </div>
  )
}

Dependencies

More by dsphoebe

View all
  • Spotlight Hover Card

    Spotlight Hover Card

  • Text Scramble

    Text Scramble

  • Magnetic Button

    Magnetic Button