# theSVG

By **thesvg** · Software & Tools

Open-source brand SVG icon library with 6,149+ typed, tree-shakeable icons for developers and designers.

- Source: https://thesvg.org/
- Tags: svg, icons, open-source, typescript, react, vue, svelte, cli
- Pricing: free
- Upvotes: 0

## Features

- 6,149+ brand SVG icons with typed metadata (hex, title, categories, variants)
- Tree-shakeable per-icon imports for ESM and CJS builds
- Typed React, Vue 3, and Svelte component packages
- shadcn-style CLI installer, copies SVG locally, zero runtime dep
- MCP server for Claude, Cursor, and Windsurf tool calls
- CDN delivery via jsDelivr for HTML, CSS, and markdown use
- VS Code extension with command-palette search, copy SVG/JSX/CDN
- Figma plugin with variant picker and keyboard shortcuts

---

## Why it matters

theSVG provides 6,149+ typed, tree-shakeable brand SVGs as a single versioned npm dependency, replacing the tedious cycle of downloading, normalizing, and re-exporting brand marks by hand. Every icon ships with its hex color, title, categories, and SVG variants, so you get structured metadata rather than a raw file dump. For any app that displays third-party brand logos, that means one `npm install`, zero manual SVG hunting, and automatic updates.

## The big picture

The library ships as several focused packages: the core `thesvg` npm convenience wrapper, `@thesvg/icons` for raw icon data, and typed framework adapters for React, Vue 3, and Svelte. The extensions page lists 6,149+ icons; the npm package at version 3.0.15 documents 3,800+ (the higher count reflects icons visible via the website and CDN that may not yet be in every published package build, per the registry README). All packages are MIT licensed; individual icons carry their respective upstream brand licenses.

## Zoom in

The shadcn-style CLI (`npx @thesvg/cli add github`) is worth calling out: it copies the SVG directly into your project rather than importing it at runtime. That matters for apps with strict Content Security Policies that block inline SVG injection via `dangerouslySetInnerHTML`, and it eliminates the npm dependency entirely for static projects. Contrast this with using the CDN path, which is simpler but ties your build to network availability and CDN uptime.

## Yes, but

The project is new and moving fast: 49 releases in roughly three months (first published March 8, 2026, with version 3.0.15 landing June 11, 2026, per the npm registry). That velocity is a double-edged signal: the icon count is growing quickly, but frequent major-version bumps mean a production app pinning `thesvg` should treat minor updates with the same caution as a more mature library's majors. Lock your version in `package.json` and test upgrades deliberately.

Also: theSVG covers brand logos, not general-purpose UI icons. If your project needs arrows, checkboxes, or navigation glyphs, reach for a different library.

## The bottom line

theSVG is the practical choice when your project needs typed, bundle-safe brand icons without the overhead of manually sourcing and normalizing SVGs from dozens of brand asset pages. Install: `npm install thesvg`, full docs at thesvg.org.

## FAQ

### What is theSVG?

theSVG is an open-source brand SVG icon library that packages 6,149+ brand logos as typed, tree-shakeable npm modules. Each icon ships with its raw SVG string, hex color, title, category tags, and multiple variants (default, mono, dark). The library is MIT licensed for the package code, with individual icons carrying their upstream brand licenses.

### How do I install and use theSVG in a project?

Run `npm install thesvg` to add the convenience package. You can then import per-icon with `import github from 'thesvg/github'` to access `github.svg`, `github.hex`, and `github.variants`, or use a barrel import like `import { github, vercel } from 'thesvg'` for multiple icons. For React, the `@thesvg/react` package provides typed forwardRef components; Vue 3 and Svelte have their own adapter packages. The CLI (`npx @thesvg/cli add github`) copies the SVG directly into your project with no runtime dependency, which is useful for static sites or CSP-restricted apps.

### Is theSVG free and open source?

Yes, the npm package is published under the MIT license, first released March 8, 2026, per the npm registry. The package code is freely usable in commercial and open-source projects. Individual icons carry their respective upstream brand licenses, so teams with strict brand-usage legal requirements should review those separately. A paid REST API is listed as planned at api.thesvg.org but has not launched yet.

### What is theSVG best for?

theSVG is best for web apps that display third-party brand logos, such as a tech-stack section, an integration directory, or a fintech app showing payment provider marks. Its typed metadata (hex colors, categories, variants) eliminates manual brand-color lookups, and per-icon tree-shaking keeps bundle size proportional to what you actually use. It also integrates with AI agents via an MCP server compatible with Claude, Cursor, and Windsurf, making it useful in agentic UI generation workflows.

### How does theSVG compare to simple-icons or other brand icon libraries?

simple-icons, the closest established alternative, provides around 3,200 brand SVGs as raw files with minimal metadata and no typed framework packages. theSVG adds per-icon TypeScript types, hex color variants, an MCP server, and ready-made React/Vue/Svelte components, making it more ergonomic for typed codebases and agent-driven workflows. The tradeoff is maturity: simple-icons has years of community vetting behind it, while theSVG shipped its first version in March 2026 and has moved through 49 releases in roughly three months, so it carries more churn risk for production applications.

### What are the limitations and risks of using theSVG?

The most concrete risk is version churn: 49 npm releases between March and June 2026 signals an actively evolving API, and production apps should pin to a specific version and test upgrades deliberately rather than accepting automatic minor updates. There is also a documented icon-count discrepancy, the npm package at version 3.0.15 states 3,800+ icons while the website and extensions page advertise 6,149+, so the exact available set depends on which surface you use. Finally, the library covers brand logos only; it is not a substitute for a general-purpose UI icon set, and each icon's brand license must be reviewed independently for commercial use.

---
[View on Analog](https://analoghq.ai/es/thesvg/software-tools/thesvg)