Cardog Icons

A comprehensive library of car brand logos and icons for React and React Native applications.

Acura	Alfa Romeo	Aston Martin	Audi	Bentley	BMW	Bugatti	Buick
BYD	Cadillac	Chevrolet	Chrysler	Dodge	Ferrari	Fiat	Ford
Genesis	GMC	Honda	Hummer	Hyundai	Infiniti	Jaguar	Jeep
Kia	Koenigsegg	Lamborghini	Land Rover	Lexus	Lincoln	Lotus	Lucid
Maserati	Mazda	Mercedes-Benz	McLaren	Mini	Mitsubishi	Nissan	Pagani
Polestar	Porsche	RAM	Rivian	Rolls-Royce	Subaru	Tesla	Toyota
VinFast	Volkswagen	Volvo

Packages

This monorepo contains the following packages:

• @cardog-icons/core: Core functionality for SVG optimization and processing
• @cardog-icons/react: React components for car brand icons
• @cardog-icons/react-native: React Native components for car brand icons
• web: Documentation website and icon explorer

Features

• 380+ optimized SVG icons for car brands
• Two variants: Color (default) and Mono (dark mode optimized)
• TypeScript support with type definitions
• Support for both React and React Native
• Consistent API across platforms
• Tree-shakable, only import what you need
• Easy customization of size, color, and other props

What's New in v1.2.0

• React 19 support - full compatibility with React 19 peer dependencies
• New size prop - easily scale icons with <BMWLogo size={48} />
• Redesigned icons browser with sidebar filters
• Dark mode support for website hero

Installation

React

npm install @cardog-icons/react
# or
yarn add @cardog-icons/react
# or
pnpm add @cardog-icons/react

React Native

npm install @cardog-icons/react-native react-native-svg
# or
yarn add @cardog-icons/react-native react-native-svg
# or
pnpm add @cardog-icons/react-native react-native-svg

Usage

React

import { BMWLogo, BMWLogoDark, AudiIcon } from "@cardog-icons/react";
// or import the generic Icon component
import { Icon } from "@cardog-icons/react";

function App() {
  return (
    <div>
      {/* Color variant (default) */}
      <BMWLogo size={48} />
      <AudiIcon size={32} />

      {/* Mono/Dark variant - great for dark backgrounds */}
      <BMWLogoDark size={48} className="text-white" />

      {/* Using generic Icon component */}
      <Icon name="BMWLogo" size={48} />
      <Icon name="BMWLogoDark" size={48} />
    </div>
  );
}

React Native

import { BMWLogo, BMWLogoDark, AudiIcon } from "@cardog-icons/react-native";
// or import the generic Icon component
import { Icon } from "@cardog-icons/react-native";

function App() {
  return (
    <View>
      {/* Color variant (default) */}
      <BMWLogo width={48} height={48} />
      <AudiIcon width={32} height={32} />

      {/* Mono/Dark variant */}
      <BMWLogoDark width={48} height={48} fill="white" />

      {/* Using generic Icon component */}
      <Icon name="BMWLogo" width={48} height={48} />
    </View>
  );
}

Icon Naming Convention

Icons follow a consistent naming pattern:

• {Brand}Icon - Compact badge/emblem icon
• {Brand}Logo - Full logo
• {Brand}LogoHorizontal - Horizontal logo layout
• {Brand}Wordmark - Text-only brand name

Each comes in two variants:

• Default (color) - e.g., BMWLogo
• Dark/Mono - e.g., BMWLogoDark

Available Brands

Acura, Alfa Romeo, Aston Martin, Audi, Bentley, BMW, Bugatti, Buick, BYD, Cadillac, Chevrolet, Chrysler, Dodge, Ferrari, Fiat, Ford, Genesis, GMC, Honda, Hummer, Hyundai, Infiniti, Jaguar, Jeep, Kia, Koenigsegg, Lamborghini, Land Rover, Lexus, Lincoln, Lotus, Lucid, Maserati, Mazda, Mercedes-Benz, McLaren, Mini, Mitsubishi, Nissan, Pagani, Polestar, Porsche, RAM, Rivian, Rolls-Royce, Subaru, Tesla, Toyota, VinFast, Volkswagen, Volvo

Development

Setup

# Clone the repo
git clone https://github.com/cardog/cardog-icons.git
cd cardog-icons

# Install dependencies
pnpm install

# Build all packages
pnpm build:all

Scripts

• pnpm build: Build all packages
• pnpm dev: Start development mode for all packages
• pnpm optimize: Optimize SVG files
• pnpm generate: Generate icon components
• pnpm build:all: Optimize SVGs, build core, generate components, and build all packages
• pnpm web: Run the documentation website locally

Ownership

All logos and assets are property of their respective owners, any issues can be filed in our Github repository

License

MIT © Cardog