Skip to main content
Any connector with a stable id, a display name, and a matching @thesvg/icons logo can be added to the catalog. Once merged, the connector becomes available as a typed named export and appears in toolCatalog for every user of the package.

​
Before you start

For well-known tools with official brands, pull requests are always welcome. If the connector is niche or internal-facing, consider opening a GitHub issue first to discuss whether it belongs in the shared catalog before investing time in a PR.

​
Step-by-step

1

Confirm the icon exists in @thesvg/icons

Visit thesvg.org and search for the brand. Note the exact slug — for example, acme. The slug must resolve to a valid @thesvg/icons/<slug> subpath import.
2

Add the icon import to src/tool-catalog.ts

Import the raw SVG string using the exact per-slug subpath. Barrel imports are not permitted:
3

Export a typed catalog item

Define and export a ToolCatalogItem constant below the imports. Keep the export name in PascalCase and the id in kebab-case (or use the slug form consistent with the existing catalog):
4

Add the export to the toolCatalog array

Find the toolCatalog array in the same file and append the new constant. Nothing needs to be changed in src/index.ts — it already re-exports everything from src/tool-catalog.ts:
5

Run the test suite

From the repository root, run:
The test suite builds the package, generates type declarations and CSS, then verifies unique IDs, named exports, and SVG content. All checks must pass before opening a PR.
6

Open a pull request against the dev branch

Push your branch and open a pull request targeting dev. Describe the connector being added and confirm that npm test passes. Keep the PR focused — unrelated formatting changes, dependency bumps, or generated catalog updates should be excluded.

​
Conventions

Keep these conventions in mind when editing src/tool-catalog.ts:
  • Stable, unique IDs. Connector id values must be unique across the entire catalog. Use kebab-case or the underscore form that matches existing catalog entries for that brand.
  • Per-icon imports only. Always use @thesvg/icons/<slug> subpath imports. Do not import from the @thesvg/icons barrel.
  • Catalog entries must include an image. Every item added to toolCatalog must have an image field — either a @thesvg/icons SVG or a trusted inline SVG string (see below).
  • Trademarks. Product names and logos are trademarks of their respective owners. The catalog provides display metadata only.
  • No new icon dependencies. Do not add a new package dependency for a single logo. Use an inline SVG string if no @thesvg/icons entry exists.

​
If no @thesvg/icons logo exists

When the brand has no entry in @thesvg/icons, define a trusted inline SVG string beside the connector and reference it as content:
SVG content must be the complete <svg>...</svg> markup including a viewBox. Use explicit fill colors — SVG rendered via <img> does not inherit currentColor.
For full project conventions, release process, and development setup, see the CONTRIBUTING.md file in the repository.