theSVG Icon Library

The thesvg Browser Extension is an open SVG brand library that allows users to search and copy over 6,030 MIT-licensed brand icons directly from their browser.

Key Features:

• Instant Search: Uses a local Fuse.js index for search-as-you-type functionality with no server round trips or rate limits.
• Multiple Output Formats: Every icon can be copied in three formats:
  • Raw SVG code: For direct pasting into projects.
  • jsDelivr CDN URL: For use in <img> tags or CSS backgrounds.
  • Markdown snippet: Formatted for README files and documentation.
• Variant Support: Provides access to multiple brand variants, such as color, mono, light, dark, and wordmark.
• Privacy-Focused: No accounts, no telemetry, and no remote code execution. Icon data is fetched on demand from the jsDelivr public CDN.

The thesvg extension is designed with a zero-data-collection policy.

Data Collection & Storage

• Data Collected: None.
• Storage: Uses the browser storage API locally to persist user preferences (e.g., recent icon picks, display settings). This data never leaves the user's device.
• Analytics: None. No tracking pixels, analytics SDKs, or error reporting services are used.

Network & Clipboard

• Network: Fetches SVG files on demand from https://cdn.jsdelivr.net/. These are public CDN requests with no user-identifying information.
• Clipboard: Uses the clipboardWrite permission to allow users to copy SVG code, CDN URLs, or markdown. The extension does not read clipboard contents.

When providing icons from theSVG, keep these legal constraints in mind:

• theSVG Codebase: Licensed under MIT.
• Brand Marks: Remain trademarks of their respective owners. Users should review brand-specific usage guidelines for commercial use.
• AWS Architecture Icons: Licensed under CC BY-ND 2.0 (no derivatives, must distribute unmodified).

Warning: If a user requests to recolor, distort, or compose a brand mark into a new logo, you should flag the potential trademark risk.

Once an icon is published in the registry, the project follows these commitments:

• Verbatim Recording: Your declared license is recorded exactly as stated in the icons.json entry. This field is part of the public API inherited by downstream consumers (e.g., @thesvg/icons).
• Public Visibility: The license is displayed on the icon's detail page at thesvg.org/icon/<slug>.
• No Relicensing: The project will never re-publish an asset under a more permissive license than what you declared (e.g., a CC BY-ND 4.0 icon will never be re-published as MIT).
• Removal: Icons will be promptly removed or relicensed if the declared license is found to be incorrect.

The plugin functions by fetching data from the jsDelivr CDN mirror of the open-source theSVG repo. This ensures high performance and availability even during peak traffic on the main website.

Data Fetching Logic:

• Manifest: Fetches the static manifest from https://thesvg.org/api/registry.json.
• SVG Files: Pulls individual SVGs directly from https://thesvg.org/icons/{slug}/default.svg.
• Insertion: Icons are inserted into the Figma canvas as native vector nodes using the figma.createNodeFromSvg() API.

The project uses a deduplication strategy to merge icon data from multiple sources into a single unified entry.

Merging Logic:

1. Primary Key: Use the slug (kebab-case version of the title) as the unique identifier.
2. Data Merging: When a brand exists in multiple repositories, combine their strengths:
   • From simple-icons: Take the monochrome variant, hex color, and aliases.
   • From svgl: Take the color/light/dark variants, wordmarks, and categories.
   • From lobe-icons: Take the color variants (extracted from JSX).
3. Categorization: Prefer svgl categories; if unavailable, fall back to lobe-icons group mapping.

Brand icons in the library are provided for identification and development purposes only under nominative fair use. theSVG is not affiliated with or endorsed by the brand owners.

Usage Guidelines:

• You may use icons to identify a brand (e.g., a "Login with GitHub" button).
• You must comply with each brand's official usage guidelines.
• theSVG does not grant trademark rights; these remain with the brand owner.
• For high-fidelity requirements, download official assets directly from the brand's press kit.

Icon component names are generated by converting the icon slug to PascalCase. If a slug starts with a digit, it is prefixed with I to ensure a valid JavaScript identifier.

| Slug                  | Component name         |
|-----------------------|------------------------|
| `github`              | `Github`               |
| `visual-studio-code`  | `VisualStudioCode`     |
| `figma`               | `Figma`                 |
| `01dotai`             | `I01Dotai`             |
| `dotnet`              | `Dotnet`               |

When submitting icons to thesvg.org, it is critical to distinguish between the License and the Trademark. Confusing these is the most common mistake.

• License: Controls who can copy, modify, or redistribute the SVG file. It is set by the author or publisher and is found in the asset's LICENSE file.
• Trademark: Controls who can use the brand mark to identify goods or services. It is set by the brand owner (often via registration) and is found in