npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

rocketicons

v0.3.2

Published

rocketicons is a React component system, for web and mobile, that provides a variety of collections with high-quality open-source icons for your projects. With the power of Tailwind.

Readme

Rocketicons

Search thousands of open-source icons, then add only the icons your project uses. Rocketicons writes selected components into your source tree for React and React Native, with Tailwind-compatible styling. No full icon collection is imported into the application, and unused icons do not rely on tree-shaking to disappear.

Why Rocketicons?

Most icon libraries install a package containing a complete collection. Rocketicons takes a different route: choose an icon, run the CLI, and receive one local component that your application owns and compiles.

  • Minimal by construction: selected icons become local source files.
  • React and React Native: share the same component API across web and native projects.
  • Tailwind-compatible: style color, size, dark mode, and states with familiar classes.
  • Reviewable and repeatable: generated files can be inspected and committed with your feature.
  • Agent-friendly discovery: browse the versioned static catalog starting at /ai/v1/catalog.json.

Initialization still installs the shared @rocketicons/utils and @rocketicons/tailwind dependencies. Rocketicons is precise about that tradeoff: selected icon source stays local, while common rendering and styling behavior remains shared.

Quick start

The current CLI requires an existing TypeScript project with tsconfig.json and uses npm during initialization.

npx rocketicons init
npx rocketicons add @rc/rc-rocket-icon

Then import the generated component:

import RcRocketIcon from "@/ri/icons/rc-rocket-icon";

export function LaunchButton() {
  return <RcRocketIcon className="icon-sky-500-lg dark:icon-white-lg" />;
}

The CLI currently writes TSX to src/ri, configures the @/ri/* alias, and adds one icon per command. Run add repeatedly when you need a small set.

Commit src/ri with your application so collaborators, CI, deployments, and offline builds use the same icon source.

Documentation and machine discovery

MCP support and agent-oriented CLI flags are planned roadmap work; they are not part of the current CLI.

Monorepo packages

  • @rocketicons/cli — initializes projects and writes selected icon components.
  • rocketicons — generated catalog data and legacy package exports.
  • @rocketicons/utils — shared component utilities.
  • @rocketicons/tailwind — Tailwind integration.
  • @rocketicons/core and @rocketicons/generator — generation pipeline.
  • ignition — the statically exported website.

Development

Install dependencies and run workspace checks from the repository root:

npm install
npm run test-all
npm run lint-all
npm run build-all

Website-specific development commands live in packages/ignition/README.md.

License

Rocketicons is released under the MIT License. Included icon collections retain their upstream licenses; review the collection metadata and license URL before use.