CLAUDE CODE MARKETPLACES

thesvg

The open SVG brand library: 7,600+ brand logos and cloud icons (AWS, Azure, GCP) as official SVG. Search, copy, ship via npm, CDN, CLI, React, Vue, Svelte, Figma, VS Code, Raycast and MCP. Free, MIT, no gatekeeping.

README.md
<p align="center"> <a href="https://thesvg.org"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/glincker/thesvg/main/public/logo-wordmark-dark.svg" /> <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/glincker/thesvg/main/public/logo-wordmark.svg" /> <img src="https://raw.githubusercontent.com/glincker/thesvg/main/public/logo-wordmark.svg" alt="theSVG" height="48" /> </picture> </a> </p> <h3 align="center">The open SVG brand library</h3> <p align="center"><b>A HOME FOR EVERY BRAND.</b></p> <p align="center"> 7,600+ brand logos and cloud icons. Search, copy and ship them as SVG, React, Vue, Svelte, CDN, CLI or MCP.<br /> Free, open source, no gatekeeping. </p> <p align="center"> <a href="https://www.npmjs.com/package/thesvg"><img src="https://img.shields.io/npm/v/thesvg?style=flat-square&color=C2410C&label=npm" alt="npm" /></a> <a href="https://www.npmjs.com/package/thesvg"><img src="https://img.shields.io/npm/dm/thesvg?style=flat-square&color=C2410C&label=downloads" alt="downloads" /></a> <a href="https://www.npmjs.com/package/@thesvg/mcp-server"><img src="https://img.shields.io/npm/v/@thesvg/mcp-server?style=flat-square&color=C2410C&label=MCP" alt="MCP server" /></a> <a href="https://www.jsdelivr.com/package/gh/glincker/thesvg"><img src="https://data.jsdelivr.com/v1/package/gh/glincker/thesvg/badge" alt="jsDelivr" /></a> <a href="https://github.com/glincker/thesvg/stargazers"><img src="https://img.shields.io/github/stars/glincker/thesvg?style=flat-square&label=stars" alt="stars" /></a> <a href="https://discord.gg/Ar5pcaZB99"><img src="https://img.shields.io/discord/829168897080557579?style=flat-square&logo=discord&logoColor=white&label=discord&color=5865F2" alt="Discord" /></a> <a href="https://github.com/glincker/thesvg"><img src="https://img.shields.io/badge/icons-7%2C600%2B-C2410C?style=flat-square" alt="7,600+ icons" /></a> <a href="https://github.com/glincker/thesvg/blob/main/LICENSE"><img src="https://img.shields.io/github/license/glincker/thesvg?style=flat-square" alt="license" /></a> <a href="https://www.figma.com/community/plugin/1612997159050367763"><img src="https://img.shields.io/badge/Figma-Plugin-F24E1E?style=flat-square&logo=figma&logoColor=white" alt="Figma" /></a> <a href="https://marketplace.visualstudio.com/items?itemName=glincker.thesvg"><img src="https://img.shields.io/badge/VS%20Code-Extension-007ACC?style=flat-square&logo=visualstudiocode&logoColor=white" alt="VS Code" /></a> <a href="https://www.raycast.com/thegdsks/thesvg"><img src="https://img.shields.io/badge/Raycast-Store-FF6363?style=flat-square&logo=raycast" alt="Raycast" /></a> <a href="https://icon-sets.iconify.design/thesvg-color/"><img src="https://img.shields.io/badge/Iconify-2%20sets-026C9C?style=flat-square" alt="Iconify" /></a> <a href="https://github.com/glincker/thesvg/tree/main/extensions/neovim"><img src="https://img.shields.io/badge/Neovim-Plugin-019733?style=flat-square&logo=neovim&logoColor=white" alt="Neovim" /></a> <a href="https://github.com/glincker/thesvg/tree/main/extensions/alfred"><img src="https://img.shields.io/badge/Alfred-Workflow-5C1F87?style=flat-square&logo=alfred&logoColor=white" alt="Alfred" /></a> <a href="https://github.com/glincker/thesvg/tree/main/extensions/browser"><img src="https://img.shields.io/badge/Chrome-Coming%20Soon-4285F4?style=flat-square&logo=googlechrome&logoColor=white" alt="Chrome" /></a> <a href="https://skills.sh/glincker/thesvg"><img src="https://skills.sh/b/glincker/thesvg" alt="skills.sh" /></a> <a href="https://github.com/glincker/homebrew-thesvg"><img src="https://img.shields.io/badge/Homebrew-thesvg-FBB040?style=flat-square&logo=homebrew&logoColor=white" alt="Homebrew" /></a> </p> <p align="center"> <a href="https://thesvg.org"><strong>Browse icons</strong></a> &nbsp;&bull;&nbsp; <a href="#quick-start">Quick start</a> &nbsp;&bull;&nbsp; <a href="#install">Install</a> &nbsp;&bull;&nbsp; <a href="#extensions">Extensions</a> &nbsp;&bull;&nbsp; <a href="#cdn">CDN</a> &nbsp;&bull;&nbsp; <a href="#api">API</a> &nbsp;&bull;&nbsp; <a href="#packages">Packages</a> &nbsp;&bull;&nbsp; <a href="https://thesvg.org/compare">Compare</a> &nbsp;&bull;&nbsp; <a href="#community">Community</a> &nbsp;&bull;&nbsp; <a href="#contributing">Contribute</a> &nbsp;&bull;&nbsp; <a href="#contributors">Contributors</a> </p> <p align="center"> <a href="https://thesvg.org"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/glincker/thesvg/main/public/og-image.png" /> <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/glincker/thesvg/main/public/og-image-light.png" /> <img src="https://raw.githubusercontent.com/glincker/thesvg/main/public/og-image-light.png" alt="theSVG, the open SVG brand library" width="720" /> </picture> </a> </p> <p align="center"> <sub>Every logo below is served straight from theSVG.</sub> </p> <p align="center"> <a href="https://thesvg.org/icon/google"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/google/default.svg" height="34" alt="Google" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/docker"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/docker/default.svg" height="34" alt="Docker" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/kubernetes"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/kubernetes/default.svg" height="34" alt="Kubernetes" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/react"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/react/default.svg" height="34" alt="React" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/vue"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/vue/default.svg" height="34" alt="Vue" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/svelte"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/svelte/default.svg" height="34" alt="Svelte" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/typescript"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/typescript/default.svg" height="34" alt="TypeScript" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/tailwindcss"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/tailwindcss/default.svg" height="34" alt="Tailwind CSS" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/figma"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/figma/default.svg" height="34" alt="Figma" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/stripe"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/stripe/default.svg" height="34" alt="Stripe" /></a> </p> <p align="center"> <a href="https://thesvg.org/icon/slack"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/slack/default.svg" height="34" alt="Slack" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/discord"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/discord/default.svg" height="34" alt="Discord" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/spotify"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/spotify/default.svg" height="34" alt="Spotify" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/supabase"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/supabase/default.svg" height="34" alt="Supabase" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/postgresql"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/postgresql/default.svg" height="34" alt="PostgreSQL" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/mongodb"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/mongodb/default.svg" height="34" alt="MongoDB" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/cloudflare"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/cloudflare/default.svg" height="34" alt="Cloudflare" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/terraform"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/terraform/default.svg" height="34" alt="Terraform" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/aws"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/amazon-badge/default.svg" height="34" alt="AWS" /></a>&nbsp;&nbsp;&nbsp; <a href="https://thesvg.org/icon/microsoft-azure"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/microsoft-azure/default.svg" height="34" alt="Azure" /></a> </p> <hr />

Why theSVG

Most icon libraries focus on UI icons. Brand logos are scattered across press kits, Figma files, and random GitHub repos. theSVG is the single source for SVG icons - brand logos, cloud architecture diagrams, and more. Searchable, versioned, and available as npm packages, CDN, CLI, API, and MCP server.

Every developer has hunted for a company logo: a press kit buried three clicks deep, a PNG that blurs on retina, a "mono" file that is secretly four colors, a logo that changed last month. Most icon sets cover UI glyphs. Nobody treated brand logos as real, versioned, trustworthy data.

theSVG does. It is one open catalog where every logo is official, clean, complete and current, and it is delivered in whatever shape your project needs.

Why we built it

theSVG started with a pull request. We tried to add the logo of our own product, AskVerdict, to an existing open source logo library, and it was declined as outside that project's scope, which is a fair call for a curated set. That made us want a catalog where any real brand, large or small, can be added through a simple review. theSVG now holds over 7,600 icons, sourced from official brand assets and checked before each one is merged.

A HOME FOR EVERY BRAND.

The theSVG standard

What every icon in the catalog is held to, and what we want a brand SVG to mean everywhere:

PrincipleWhat it means in practice
Official, unmodifiedTaken from the brand's own kit or site, with a license and a guidelines link on every entry. No redraws.
Complete variantsdefault, mono, light, dark and wordmark under one predictable naming scheme, so {slug}/{variant}.svg always works.
Truly cleanA validator runs in CI on every changed file: no scripts, no embedded rasters, no null or NaN values, mono files really are single color, viewBox always present.
Rebrands keep historyWhen a brand changes its logo, the new mark becomes current and the old one is kept as a -legacy entry, linked both ways. Nothing silently disappears.
Machine readableA static manifest, llms.txt, an MCP server and stable CDN URLs, so tools and AI assistants can use logos as reliably as people do.
Open to everyoneMIT code, no accounts, no API keys, no gatekeeping. If a brand is real, it belongs here.

If that is the logo library you wished existed, the single most useful thing you can do is star the repo. It is how other developers find it.

<table> <tr> <td align="center" width="25%"><strong>7,600+</strong><br />icons</td> <td align="center" width="25%"><strong>12,300+</strong><br />variants: color, mono, light, dark, wordmark</td> <td align="center" width="25%"><strong>150+</strong><br />categories</td> <td align="center" width="25%"><strong>21</strong><br />brand families</td> </tr> </table>

What is inside

       CollectionIconsWhat you get
<picture><source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/github/dark.svg" /><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/github/light.svg" width="28" height="28" alt="" /></picture>Brand icons4,800+Logos from 150+ categories in color, mono, light, dark and wordmark
<picture><source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/1password/dark.svg" /><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/1password/light.svg" width="28" height="28" alt="" /></picture>Auth badges858Circular badges for 2FA and authenticator UIs
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/amazon-badge/default.svg" width="28" height="28" alt="" />AWS Architecture739Official AWS service and resource icons
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/microsoft-azure/default.svg" width="28" height="28" alt="" />Azure626Microsoft Azure service icons
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/docker/default.svg" width="28" height="28" alt="" />Community256Dev tools, databases and frameworks
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/google-cloud/default.svg" width="28" height="28" alt="" />Google Cloud214Google Cloud Platform icons
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/kubernetes/default.svg" width="28" height="28" alt="" />Kubernetes38Official CNCF architecture icons
<details> <summary>Collections, plain table</summary>

theSVG organizes icons into collections:

CollectionIconsDescription
Brand Icons4,800+Brand logos from 150+ categories
Auth Badges858Circular icon badges styled for 2FA/authenticator apps
AWS Architecture739Official AWS service, resource, category, and group icons (2026-Q1)
Azure Services626Microsoft Azure service icons (2026-Q1)
Community256Dev tools, databases, and frameworks sourced from the open-source community
Google Cloud214Google Cloud Platform icons (2026-Q1)
Kubernetes38Official Kubernetes/CNCF architecture icons
</details>

Brand families

Products grouped by the company that owns them, so you get the whole Google, Microsoft, Amazon or Apple line in one place with every variant. Browse all 21 at thesvg.org/families.

<table> <tr> <td align="center"><a href="https://thesvg.org/family/google"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/google/default.svg" height="32" alt="" /><br /><b>Google</b></a><br /><sub>100+ logos</sub></td> <td align="center"><a href="https://thesvg.org/family/microsoft"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/microsoft/default.svg" height="32" alt="" /><br /><b>Microsoft</b></a><br /><sub>70+ logos</sub></td> <td align="center"><a href="https://thesvg.org/family/adobe"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/adobe/default.svg" height="32" alt="" /><br /><b>Adobe</b></a><br /><sub>30+ logos</sub></td> <td align="center"><a href="https://thesvg.org/family/amazon"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/amazon-badge/default.svg" height="32" alt="" /><br /><b>Amazon</b></a><br /><sub>18 logos</sub></td> <td align="center"><a href="https://thesvg.org/family/apple"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/apple/dark.svg" /><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/apple/light.svg" height="32" alt="" /></picture><br /><b>Apple</b></a><br /><sub>16 logos</sub></td> <td align="center"><a href="https://thesvg.org/family/jetbrains"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/jetbrains/default.svg" height="32" alt="" /><br /><b>JetBrains</b></a><br /><sub>16 logos</sub></td> <td align="center"><a href="https://thesvg.org/family/ibm"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/ibm/default.svg" height="32" alt="" /><br /><b>IBM</b></a><br /><sub>14 logos</sub></td> </tr> </table>

The full breakdown lives in Collections, families and categories.

Highlights

  • 7,600+ icons across multiple collections
  • 4,800+ brand icons across 150+ categories
  • 21 brand families - every product from Amazon, Google, Microsoft and more, grouped by owner
  • 858 Auth Badge icons - circular icon badges for 2FA/authenticator apps
  • 739 AWS Architecture icons (2026-Q1)
  • 626 Azure Service icons (2026-Q1)
  • 256 community-curated icons - dev tools, databases, frameworks
  • 214 Google Cloud icons (2026-Q1)
  • 12,300+ SVG variants - color, mono, light, dark, wordmark
  • Tree-shakeable - import one icon, ship only that icon
  • TypeScript-first - fully typed, dual ESM/CJS
  • Framework-agnostic - React, Vue, Svelte, plain HTML, or CDN
  • AI-ready - MCP server for Claude, Cursor, and Windsurf

AWS Architecture Icons

Browse all AWS service and resource icons at thesvg.org/collection/aws. Icons are sourced from the official AWS Architecture Icons package and distributed unmodified under CC BY-ND 2.0. Updated quarterly.

Auth Badges

Browse the full set at thesvg.org/collection/auth-badges. Circular, flat-color badge icons designed for authenticator-app entry lists and 2FA UI - a distinct visual style from the primary brand-mark collection above. Distributed under CC0-1.0 (public domain).

<details> <summary>Brand families, full table</summary>

Products grouped by the company that owns them, each with its own page: the whole Amazon, Google or Microsoft line in one place, with every variant.

FamilyLogosIncludes
Google100+Workspace, Gemini, Cloud, Android, Chrome
Microsoft70+GitHub, Azure, Dynamics 365, Fabric, Copilot
Adobe30+Photoshop, Illustrator, Creative Cloud
Amazon18Prime, Kindle, Music, AWS, Twitch, Ring
Apple16iOS, macOS, Music, iCloud
JetBrains16IntelliJ IDEA, PyCharm, WebStorm, Rider
IBM14Red Hat, HashiCorp, Terraform, Ansible

Browse all 21 families at thesvg.org/families. The same data is available as JSON at /api/families.json and in llms.txt.

</details>

Quick start

# Add a single icon to your project
npx @thesvg/cli add github

# Or install the package and import only what you use
npm install thesvg
import github from "thesvg/github";

github.svg;      // raw SVG string
github.title;    // "GitHub"
github.hex;      // "181717"
<!-- Or use the CDN, no install -->
<img src="https://thesvg.org/icons/github/default.svg" width="32" height="32" alt="GitHub" />

Every icon has its own page with all variants, copy formats and a live preview, for example thesvg.org/icon/github. Tree-shakeable, fully typed, ESM and CJS. More in Install and packages, Usage and variants and CDN and API.

Built for designers and developers

<table> <tr> <td width="50%" valign="top"> <h4><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/figma/default.svg" height="20" alt="" /> If you design</h4> <ul> <li>Drop official logos into Figma as <b>editable vectors</b> with the <a href="https://www.figma.com/community/plugin/1612997159050367763">Figma plugin</a>.</li> <li>Pick the right variant for the background: color, mono, light, dark or wordmark.</li> <li>No redrawing, no recoloring guesswork. Every mark is the brand's own, with a guidelines link.</li> <li>Diagramming? Use the <a href="https://icon-sets.iconify.design/thesvg-color/">Iconify sets</a> in Mermaid, plus draw.io and Excalidraw libraries, and the AWS, Azure and Google Cloud architecture icons.</li> </ul> </td> <td width="50%" valign="top"> <h4><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/visual-studio-code/default.svg" height="20" alt="" /> If you build</h4> <ul> <li>Import one icon and ship one icon: <code>thesvg/github</code> is tree-shakeable and fully typed.</li> <li>Use <a href="https://www.npmjs.com/package/@thesvg/react">React</a>, <a href="https://www.npmjs.com/package/@thesvg/vue">Vue</a> or <a href="https://www.npmjs.com/package/@thesvg/svelte">Svelte</a> components, or a plain <code>&lt;img&gt;</code> from the CDN.</li> <li>Add icons from the terminal with the <a href="https://www.npmjs.com/package/@thesvg/cli">CLI</a>, or let your AI editor fetch them through the <a href="https://www.npmjs.com/package/@thesvg/mcp-server">MCP server</a>.</li> <li>Stable URLs and a static JSON manifest, so you can build on it without keys or sign-ups.</li> </ul> </td> </tr> </table>

Install

npm

npm install thesvg

Homebrew

brew tap glincker/thesvg
brew install thesvg
import github from "thesvg/github";

github.svg;        // raw SVG string
github.title;      // "GitHub"
github.hex;        // "181717"
github.variants;   // { default: "<svg...>", mono: "<svg...>" }

Or use the scoped package for tree-shaking:

npm install @thesvg/icons

Packages

Every package is tree-shakeable, fully typed and ships ESM and CJS. Pick the one that fits your stack.

       PackageVersionDownloadsWhat it isInstall
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/npm/default.svg" width="28" height="28" alt="" />thesvgnpmdownloadsAll icons in one packagenpm install thesvg
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/npm/default.svg" width="28" height="28" alt="" />@thesvg/iconsnpmdownloadsCore icon data, tree-shakeablenpm install @thesvg/icons
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/react/default.svg" width="28" height="28" alt="" />@thesvg/reactnpmdownloadsTyped React componentsnpm install @thesvg/react
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/vue/default.svg" width="28" height="28" alt="" />@thesvg/vuenpmdownloadsTyped Vue 3 componentsnpm install @thesvg/vue
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/svelte/default.svg" width="28" height="28" alt="" />@thesvg/sveltenpmdownloadsTyped Svelte componentsnpm install @thesvg/svelte
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/react/default.svg" width="28" height="28" alt="" />@thesvg/react-nativenpmdownloadsReact Native componentsnpm install @thesvg/react-native
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/npm/default.svg" width="28" height="28" alt="" />@thesvg/clinpmdownloadsCLI tool, shadcn-style installernpx @thesvg/cli add github
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/claude/default.svg" width="28" height="28" alt="" />@thesvg/mcp-servernpmdownloadsMCP server for AI assistantsnpx @thesvg/mcp-server

Extensions

Use theSVG icons everywhere you build, design and ship. Browse the full ecosystem at thesvg.org/extensions.

       ExtensionStatusWhat it does
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/figma/default.svg" width="28" height="28" alt="" />Figma PluginPublishedBrowse 7,600+ brand SVGs, variant picker, recents row, keyboard shortcuts. Insert as editable vectors.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/visual-studio-code/default.svg" width="28" height="28" alt="" />VS CodePublishedSearch 7,600+ icons from the command palette. Copy SVG, JSX, CDN link, or insert at cursor.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/raycast/default.svg" width="28" height="28" alt="" />RaycastPublishedSearch, preview, and copy any brand SVG in one keystroke. Filter by category, preview variants.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/claude/default.svg" width="28" height="28" alt="" />MCP ServerPublishedAI tool calls for Claude, Cursor, Windsurf. Fetch icons by name or category.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/claude/default.svg" width="28" height="28" alt="" />Agent SkillPublishedDrop-in skill for AI agents. Install via npx skills add glincker/thesvg. Teaches the icon CDN and registry.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/npm/default.svg" width="28" height="28" alt="" />@thesvg/cliPublishedshadcn-style installer. npx @thesvg/cli add github drops the SVG into your project.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/homebrew/default.svg" width="28" height="28" alt="" />HomebrewPublishedbrew tap glincker/thesvg && brew install thesvg
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/jsdelivr/default.svg" width="28" height="28" alt="" />CDN via jsDelivrPublishedServe any icon via global CDN. Drop into HTML, CSS, Markdown, Notion, Webflow, Framer.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/iconify/default.svg" width="28" height="28" alt="" />IconifyPublishedBrand icons available as thesvg (mono) and thesvg-color sets. Works with any Iconify-consuming tool: Mermaid architecture diagrams, Iconify's VS Code and Figma plugins, @iconify/react, and more.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/google-chrome/default.svg" width="28" height="28" alt="" />Browser ExtensionBetaChrome, Firefox, Edge popup with 7,600+ brand SVGs. MV3, no telemetry.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/jetbrains/default.svg" width="28" height="28" alt="" />JetBrainsHelp wantedIntelliJ, WebStorm, PyCharm, Rider tool window. Help wanted.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/neovim/default.svg" width="28" height="28" alt="" />NeovimPublishedLua plugin with Telescope picker. Insert SVG URL or inline content at cursor.
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/alfred/default.svg" width="28" height="28" alt="" />Alfred WorkflowPublishedmacOS quick access. Search anywhere, copy SVG, CDN URL, or markdown.
<picture><source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/sketch/dark.svg" /><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/sketch/light.svg" width="28" height="28" alt="" /></picture>Sketch / Blender / Webflow / NotionHelp wantedTracking issues open. Build a plugin and we will list it here.

Build your own: the API and CDN are fully open with no auth required. Ship a plugin or workflow, then open a PR and we will add it to the table.

Usage

<details> <summary>React, Vue, Svelte, CDN and CLI examples</summary>

React

import { Github, Figma } from "@thesvg/react";

export function Logos() {
  return <Github width={24} height={24} className="text-white" />;
}

Vue

<script setup>
import { Github, Figma } from "@thesvg/vue";
</script>

<template>
  <Github width="24" height="24" />
</template>

Svelte

<script>
  import { Github, Figma } from "@thesvg/svelte";
</script>

<Github width="24" height="24" />

CDN

<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/github/default.svg" width="32" height="32" alt="GitHub" />

CLI

npx @thesvg/cli add github
npx @thesvg/cli search "ai"
</details>

Variants

Icons support up to 7 variants to match any design context:

VariantKeyDescription
DefaultdefaultPrimary brand color
MonomonoInherits text color
LightlightWhite, for dark backgrounds
DarkdarkBlack, for light backgrounds
WordmarkwordmarkFull text logo
Wordmark LightwordmarkLightWhite text logo
Wordmark DarkwordmarkDarkDark text logo

Not every icon has all variants. default is always present.

CDN

Use any icon directly without installing:

<!-- From thesvg.org -->
<img src="https://thesvg.org/icons/github/default.svg" width="32" height="32" alt="GitHub" />

<!-- From jsDelivr -->
<img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/github/default.svg" width="32" height="32" alt="GitHub" />

URL pattern: https://thesvg.org/icons/{slug}/{variant}.svg

API

<details> <summary>Static manifest, mirrors and examples</summary>

thesvg ships as a fully static site, served from a CDN. There is no dynamic API; instead, two pre-built JSON manifests cover every use case. Search, filter, and pagination happen on the client.

Base URL: https://thesvg.org

EndpointDescription
GET /api/registry.jsonFull icon manifest (slug, title, aliases, categories, hex, url, variant keys)
GET /api/categories.jsonCategory list with counts
GET /icons/{slug}/{variant}.svgRaw SVG file (e.g. /icons/openai/default.svg)
# Fetch the manifest once, filter client-side
curl "https://thesvg.org/api/registry.json" | jq '.icons[] | select(.slug | contains("openai"))'

# Then pull the SVG you want
curl "https://thesvg.org/icons/openai/default.svg"

Mirrors

For high-traffic apps, use jsDelivr (free, GitHub-backed) instead of hitting thesvg.org directly:

https://cdn.jsdelivr.net/gh/glincker/thesvg@main/src/data/icons.json
https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/{slug}/{variant}.svg

src/data/icons.json is the source-of-truth manifest (the same data that builds /api/registry.json, with full per-icon fields including license and dateAdded).

You can also clone the repo (~30 MB) and self-host. The codebase is MIT-licensed; individual brand icons remain trademarks of their respective owners (see LEGAL.md).

A gated, token-based API is on the roadmap at api.thesvg.org for advanced features (search relevance, usage analytics, webhooks). Until then, the static manifest above is the supported integration path.

</details>

Categories

Icons are organized into 150+ categories:

AI Analytics Identity Automotive Aviation Browser Cloud CMS Community Crypto Database Design DevTool Education Entertainment Finance Food Framework Gaming Hardware Hosting IoT Language Library Linux Media Music Payment Platform Privacy Security Self-Hosted Shopping Social Software and more...

Community

Questions, icon requests, or showing off what you built? Join the official GLINR Discord, home of theSVG and every other GLINCKER open source project. theSVG has its own forum there, and new releases post to it automatically.

<a href="https://discord.gg/Ar5pcaZB99"><img src="https://discord.com/api/guilds/829168897080557579/widget.png?style=banner2" alt="Join the GLINR Discord" /></a>

Run it locally

You need Node.js 20 or newer and pnpm.

git clone https://github.com/glincker/thesvg.git
cd thesvg
pnpm install
pnpm dev          # http://localhost:3333
CommandWhat it does
pnpm devStarts the site with hot reload on port 3333
pnpm buildRegenerates the API, llms.txt, feed and icon tones, then builds the static site
pnpm lintRuns ESLint
pnpm testRuns the Vitest suite plus the CLI and icons package tests
npx tsx scripts/validate-icons.tsAudits every SVG for scripts, bad values, non-mono mono files and missing viewBox

Add an icon: put the files in public/icons/{slug}/ (default.svg, plus mono, light, dark or wordmark as they apply), register the slug in src/data/icons.json, run the validator, then open a pull request. Full rules are in CONTRIBUTING.md.

Contributing

Every brand deserves a place. No gatekeeping.

Submit an icon: thesvg.org/submit or open a pull request.

Development setup:

git clone https://github.com/glincker/thesvg.git
cd thesvg
pnpm install
pnpm dev     # http://localhost:3333

See CONTRIBUTING.md for full guidelines.

Questions and icon requests are welcome in the Discord.

Contributors

<a href="https://github.com/glincker/thesvg/graphs/contributors"> <img src="https://contrib.rocks/image?repo=glincker/thesvg" alt="theSVG contributors" /> </a>

Follow along

New icons, rebrands and releases land every week. To keep up:

  • Star and watch the repo. Use Watch, Custom, Releases to hear about each new version.
  • Follow GLINCKER on GitHub for the rest of what we build.
  • Join the Discord to request icons and see releases the moment they ship.
  • Browse thesvg.org to see what was added recently.

Sponsor

theSVG runs on hosting, bandwidth, and maintainer time. If the catalog saves you a couple of hours a year, pick a tier and lock that value in. Tiers start at $5/mo and stack from Sketch up to Canvas.

Sponsor on GitHub

Support

theSVG runs on hosting, bandwidth and maintainer time. Sponsor on GitHub or star the repo so other developers can find it.

<p align="center"> <a href="https://github.com/glincker/thesvg"><img src="https://img.shields.io/badge/%E2%98%85%20Star%20thesvg%20on%20GitHub-C2410C?style=for-the-badge" alt="Star thesvg on GitHub" /></a> </p> <a href="https://star-history.com/#glincker/thesvg&Date"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date&theme=dark" /> <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date" /> <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date" width="600" /> </picture> </a>

Disclaimer

All brand names, logos, and trademarks are the property of their respective owners. theSVG provides these icons for development and design purposes only under nominative fair use. Use of brand assets must comply with each brand's usage guidelines.

AWS Architecture Icons are provided under CC BY-ND 2.0 (No Derivatives). Amazon Web Services and all related marks are trademarks of Amazon.com, Inc.

If you are a brand owner and would like an icon updated or removed, please open an issue or email support@glinr.com. See our Legal Notice, TRADEMARK.md, and LEGAL.md for full details.

License

MIT for the codebase and tooling. Individual brand icons remain the intellectual property of their respective trademark holders.

Star History

<a href="https://star-history.com/#glincker/thesvg&Date"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date&theme=dark" /> <source media="(prefers-color-scheme: light)" srcset="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date" /> <img alt="Star History Chart" src="https://api.star-history.com/svg?repos=glincker/thesvg&type=Date" width="600" /> </picture> </a>
<p align="center"> <a href="https://thesvg.org">thesvg.org</a> &nbsp;&bull;&nbsp; <a href="./docs/install.md">Install</a> &nbsp;&bull;&nbsp; <a href="./docs/extensions.md">Extensions</a> &nbsp;&bull;&nbsp; <a href="https://github.com/glincker/thesvg/issues">Issues</a> </p> <p align="center"><sub>Built by GLINCKER. More from the team:</sub></p> <table align="center"> <tr> <td align="center" width="33%"> <a href="https://github.com/glincker"><picture><source media="(prefers-color-scheme: dark)" srcset="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/glincker/light.svg" /><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/glincker/default.svg" height="40" alt="GLINCKER" /></picture><br /><b>GLINCKER</b></a><br /> <sub>Open source from the team behind theSVG</sub> </td> <td align="center" width="33%"> <a href="https://levelrail.com"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/levelrail/default.svg" height="40" alt="Levelrail" /><br /><b>Levelrail</b></a><br /> <sub>Self-hosted alternative to Vercel and Coolify. Git push, HTTPS, logs, rollback.</sub> </td> <td align="center" width="33%"> <a href="https://theauth.dev"><img src="https://cdn.jsdelivr.net/gh/glincker/thesvg@main/public/icons/theauth/default.svg" height="40" alt="theAuth" /><br /><b>theAuth</b></a><br /> <sub>Auth for AI agents and humans. Agent identity, MCP OAuth 2.1, audit.</sub> </td> </tr> </table>