@hanzo/logo

Official Hanzo logo package providing TypeScript/React components and utilities for consistent branding across the Hanzo ecosystem.

Logo Showcase

Features

• 🎨 SVG Logo Generation - Programmatically generate Hanzo logos in multiple formats
• ⚛️ React Components - Ready-to-use React components with TypeScript support
• 🎯 Multiple Variants - Color, monochrome, and menu bar optimized versions
• 📦 Icon Generation - Generate icons in all required sizes for web and desktop apps
• 🖥️ Platform Icons - macOS dock icons, menu bar icons, and favicons
• 🔧 TypeScript Native - Full TypeScript support with proper type definitions

Installation

npm install @hanzo/logo
# or
yarn add @hanzo/logo
# or
pnpm add @hanzo/logo

Quick Start

React Component

import { HanzoLogo } from '@hanzo/logo/react';

<HanzoLogo size={128} />
<HanzoLogo variant="mono" size={64} />
<HanzoLogo variant="white" className="w-16 h-16" />

SVG Generation

import { getColorSVG, getMonoSVG, getWhiteSVG } from '@hanzo/logo';

const colorLogo = getColorSVG();
const monoLogo = getMonoSVG();
const whiteLogo = getWhiteSVG();

Icon Generation

import { generateIcon, getColorSVGCropped } from '@hanzo/logo';

// Generate macOS dock icon
const svg = getColorSVGCropped();
await generateIcon(svg, 'dock-icon.png', 512, true);

License

MIT © Hanzo AI

Support

For issues, questions, or suggestions, visit GitHub Issues