Open-source brand SVG icon library with 6,149+ typed, tree-shakeable icons for developers and designers.
Qué hace
theSVG is a brand SVG icon library with 6,149+ icons, available as a typed, tree-shakeable npm package with framework components for React, Vue, and Svelte. It ships per-icon TypeScript types, color hex values, and variants, plus an MCP server, CLI, and Figma plugin.
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 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.
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.
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.
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.
Características
Notas de campo
Revisado el Jun 27, 2026
Ideal para
Resultados para creadores
Ten cuidado
Probado con
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.
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.
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.
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.
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.
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.
Viсtor Zakharchenko 🇺🇦@zahareus
“thesvg — 5,880+ brand SVG icons as one npm package. Tree-shakeable, typed, MIT, no attribution. Works with React, Vue, Svelte, Next, Tailwind. 1.8k stars in two months.”
TOOOLS.design@tooolsdesign
“theSVG (by @thegdsks) 6,000+ brand logos as SVGs: color, mono, light, dark, and wordmark variants. Free, no attribution required.”
Dezi Gallery@dezigallery
“Introducing "theSVG" the latest addition to Dezi Gallery. Search, copy, and ship 6,047+ brand SVG icons. Open-source library with npm, React, Vue, Svelte, CLI, CDN, and MCP server support. @thegdsks”
Streamline Pixel Icons: a 442k-icon library with 34 families, Figma plugin, and VS Code extension for designers and developers who need consistent, large-scale icon sets.
Best for Teams building large design systems that need cohesive icon coverage across many concepts and stylesshadcn/ui, open-source, copy-owned UI components for developers building their own design system with full code control.
Best for Teams building a custom design system who need full ownership of component source code78+ animated shadcn/ui components plus 100+ AI agent patterns, distributed as copy-paste source, free, open-source, and zero npm lock-in.
Best for React and Tailwind teams already using shadcn/ui who want animated, accessible components without npm package overheadUna colección de spinners, loaders y animaciones de carga para aplicaciones web modernas, construida con React, Next.js, shadcn/ui, Tailwind CSS y Framer Motion.
Best for Añadir spinners y animaciones de carga rápidamenteUna biblioteca de animaciones de carga reutilizables en estilo dotmatrix para React y Next.js, instalable a través del registro de shadcn o copiando el código fuente directamente desde la documentación.
Best for Loaders con el distintivo estilo dotmatrixOpen-source React component kit for agentic AI apps: streaming chat, tool calls, reasoning, citations, and more, SDK-agnostic and fully owned by your codebase.
Best for React teams building agentic or chat interfaces who want streaming-ready components without writing them from scratch