Home
cd ../playbooks
Developer ToolsBeginner

LLM Icon Finder

Find and download AI/LLM model brand icons from the lobe-icons library — Claude, GPT, Gemini, and more — as ready-to-use SVG, PNG, or WEBP URLs.

5 minutes
By daymadeSource
#icons#branding#ai#svg#design

Hunting for an official, correctly-licensed brand logo for an AI model wastes time and produces inconsistent assets. This playbook pulls clean icon URLs in any format on demand.

Who it's for: frontend developers, designers, product teams, content creators

Example

"Get me SVG icons for Claude, GPT, and Gemini" → Direct lobe-icons URLs for each brand in the format you asked for

CLAUDE.md Template

New here? 3-minute setup guide → | Already set up? Copy the template below.

Or install from your terminal:
npx ccplaybooks add llm-icon-finder
# Finding AI/LLM Brand Icons

Access AI/LLM model brand icons and logos from the [lobe-icons](https://github.com/lobehub/lobe-icons) library. The library contains 100+ icons for models (Claude, GPT, Gemini), providers (OpenAI, Anthropic, Google), and applications (ComfyUI, LobeChat).

## Icon Formats and Variants

**Available formats**: SVG (scalable), PNG (raster), WEBP (compressed)
**Theme variants**: light, dark, and color (some icons)

## CDN URL Patterns

Construct URLs using these patterns:

Get new playbooks like this one

One email a week with new Claude Code workflows. Free, like everything here.

No spam. Unsubscribe anytime.

README.md

What This Does

Find and download AI/LLM model brand icons from the lobe-icons library — Claude, GPT, Gemini, and more — as ready-to-use SVG, PNG, or WEBP URLs.

What's Inside

The template covers:

  • Icon Formats and Variants
  • CDN URL Patterns
  • Workflow
  • Finding Icon Names
  • Examples
  • Troubleshooting

Quick Start

Step 1: Create a Project Folder

Make a dedicated folder for this workflow and open it in Claude Code.

Step 2: Download the Template

Click Download above to save the template, then drop it into your project as CLAUDE.md (or paste it into your existing one).

Step 3: Start Working

Tell Claude what you need in plain language — it will follow the template's workflow automatically. For example:

Get me SVG icons for Claude, GPT, and Gemini

Claude reads the template and runs the steps for you.

$Related Playbooks

Developer Tools

LLM Coding Guardrails

Four behavioral guidelines that reduce the most common Claude coding mistakes: silent assumptions, overcomplication, scope creep, and vague success criteria.

2 minutes
Beginner
Developer Tools

Multi-Stage Prompt Pipeline

A methodology for building Claude-to-Claude prompt pipelines where one stage's output feeds the next — a four-purpose taxonomy (Research/Plan/Do/Refine), per-prompt provenance folders, XML-structured outputs with required metadata tags, a fixed human-scannable SUMMARY.md, dependency-aware layered execution, and per-stage validation before anything chains forward.

10 minutes
Advanced
Developer Tools

Minimalist UI Design Skill: Editorial, Monochrome Interfaces

A frontend design system that enforces warm monochrome, bento grids, and editorial typography — the Notion/Linear look, banned from gradients, heavy shadows, and Inter

5 minutes
Beginner
Developer Tools

Mermaid Tools

Extract Mermaid diagrams from markdown files and render them to high-quality PNG images using bundled scripts — turning text diagrams into shareable visuals.

5 minutes
Beginner
Developer Tools

Minimalist MVP Scoping

Scope a weekend-shippable MVP using the manual → processized → productized progression. Build as little as possible; charge from day one.

5 minutes
Beginner
Developer Tools

MCP Server Hub Manager

Access 1200+ AI Agent tools via Model Context Protocol (MCP)

10 minutes
Advanced
Developer Tools

n8n Workflow Builder

Automate document workflows with n8n - 7800+ workflow templates

10 minutes
Advanced
Developer Tools

MCP Server Builder

Guide for creating high-quality Model Context Protocol (MCP) servers that enable LLMs to interact with external services and APIs.

30 minutes
Advanced
Developer Tools

Nuxt UI Component Guidance

Build interfaces correctly with @nuxt/ui v4 — five core rules (UApp wrapper, semantic colors, reading generated theme files for real slot names, override priority, icon naming), a task-to-focus-area routing table, the Nuxt UI MCP server for live component API lookups, and full installation for both Nuxt and standalone Vue.

5 minutes
Beginner
Developer Tools

Reshape PR Commits

Turn a branch's messy WIP/fixup commit history into a clean, logically-grouped set of commits before review — proposed regrouping with explicit approval, git reset --soft plus staged re-commits instead of interactive rebase, and hard guardrails (feature branches only, force-with-lease only, never touch another author's commits).

5 minutes
Intermediate
Developer Tools

Simplicity First Code Gate

A hard correctness gate against over-complex or oversized code — one ordering principle (human readability first, agent traceability second), five enforceable rules, and a pre-finish checklist that treats unnecessary complexity as a bug, not a style opinion.

2 minutes
Beginner
Developer Tools

Slidev Presentation Builder

Build developer-focused presentations with Slidev — Markdown-driven slides with live code, syntax highlighting, Monaco editor embeds, Mermaid/PlantUML diagrams, LaTeX math, click-based animations, and presenter notes, plus a quick-reference table for the exact syntax each feature needs.

5 minutes
Beginner

Browse all Developer Tools playbooks →