Page UI logo

Landing Page Showcase

This component displays a grid of logos or images, showcasing the companies that use the product, integrations, etc.

Import with ease

All your video assets in one platform. Import your existing footage from any device with a click.

Usage

import {
  FigmaIcon,
  TwitchIcon,
  ChromeIcon,
  InstagramIcon,
  TwitterIcon,
  FramerIcon,
  GithubIcon,
  SlackIcon,
} from 'lucide-react';
import {
  LandingShowcase,
  LandingShowcaseItem,
} from '@/components/landing/LandingShowcase';
<LandingShowcase
  title="Import with ease"
  description="All your video assets in one platform. Import your existing footage from any device with a click."
>
  <LandingShowcaseItem>
    <FigmaIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <TwitchIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <ChromeIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <InstagramIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <TwitterIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <FramerIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <GithubIcon className="w-10 h-10" />
  </LandingShowcaseItem>

  <LandingShowcaseItem>
    <SlackIcon className="w-10 h-10" />
  </LandingShowcaseItem>
</LandingShowcase>

Examples

Text Position

Import with ease

All your video assets in one platform. Import your existing footage from any device with a click.

With Background

Import with ease

All your video assets in one platform. Import your existing footage from any device with a click.

Background Glow

Import with ease

All your video assets in one platform. Import your existing footage from any device with a click.

API Reference

Prop NameProp TypeRequiredDefault
children React.ReactNodeNo-
innerClassName stringNo-
title string ǀ React.ReactNodeNo-
titleComponent React.ReactNodeNo-
description string ǀ React.ReactNodeNo-
descriptionComponent React.ReactNodeNo-
textPosition 'left' ǀ 'right'No'left'
withBackground booleanNofalse
withBackgroundGlow booleanNofalse
variant 'primary' ǀ 'secondary'No'primary'
backgroundGlowVariant 'primary' ǀ 'secondary'No'primary'

More Examples

For more even more examples, see our Landing Page Component Examples page or see complete landing page examples by Exploring Our Landing Page Templates.