Cameron Kelliher

Herdr Logo

AI chats

About

A brand logo icon component that renders Herdr's coding agent runtime mark as an inline scalable SVG.

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

Code

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

Usage.tsx

import { HerdrLogo } from "@/components/ui/herdr-logo";

export default function HerdrLogoDemo() {
  return (
    <div className="flex items-center justify-center w-full h-screen bg-background">
      <HerdrLogo className="w-24 h-24 rounded-lg" />
    </div>
  );
}

More by Cameron Kelliher

View all
  • AI Chain of Thought

    AI Chain of Thought

    111
  • Helix Loader

    Helix Loader

    94
  • AI Streaming Text

    AI Streaming Text

    50
  • AI Tool Call

    AI Tool Call

    45
  • Signal Bars Loader

    Signal Bars Loader

    41
  • Glitch Text Loader

    Glitch Text Loader

    41
  • AI Prompt Diff

    AI Prompt Diff

    39
  • AI Routing Indicator

    AI Routing Indicator

    34

More in AI chats

View all
  • AI Actions

    AI Actions

    319
  • Color Picker

    Color Picker

    82
  • Agent Chat

    Agent Chat

    17
  • Prompt with Model Picker

    Prompt with Model Picker

    2
  • System Message

    System Message

    54
  • Message Thread

    Message Thread

    36
  • Suggestions

    Suggestions

    28
  • Message With Header And Delivery Status

    Message With Header And Delivery Status

    38