Perplexity Logo

PreviousNext

Perplexity logo component with brand teal

Docs
elementsui

Preview

Loading preview…
registry/default/blocks/logos/perplexity-logo/components/logos/perplexity.tsx
import { cn } from "@/lib/utils";

export interface PerplexityLogoProps extends React.SVGProps<SVGSVGElement> {}

export function PerplexityLogo({ className, ...props }: PerplexityLogoProps) {
  return (
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="80"
      height="80"
      viewBox="0 0 48 48"
      className={cn("", className)}
      {...props}
    >
      <title>Perplexity</title>
      <path
        fill="none"
        stroke="#20808d"
        strokeLinecap="round"
        strokeLinejoin="round"
        d="M24 4.5v39M13.73 16.573v-9.99L24 16.573m0 14.5L13.73 41.417V27.01L24 16.573m0 0l10.27-9.99v9.99"
      />
      <path
        fill="none"
        stroke="#20808d"
        strokeLinecap="round"
        strokeLinejoin="round"
        d="M13.73 31.396H9.44V16.573h29.12v14.823h-4.29"
      />
      <path
        fill="none"
        stroke="#20808d"
        strokeLinecap="round"
        strokeLinejoin="round"
        d="M24 16.573L34.27 27.01v14.407L24 31.073"
      />
    </svg>
  );
}

Installation

npx shadcn@latest add @elements/perplexity-logo

Usage

import { PerplexityLogo } from "@/components/ui/perplexity-logo"
<PerplexityLogo />