0.3.1
  • Docs
  • Getting Started
  • Icons
Switch theme
GitHub
    Playground
  • Getting Started
    • Guides
      • Agent Workflows
      • Why Choose Rocketicons
      • Framework Quick Starts
      • Generated Files
      • Migrating to Rocketicons
    • Using The Icons
      • Adding Icons
      • Colors
      • Dark Mode
      • Responsive Design
      • Shortcuts
      • Sizing Icons
      • Hover, Focus and Other States
      • Styling
    • Icons
      • Ant Design Icons
      • BoxIcons
      • Bootstrap Icons
      • css.gg
      • Circum Icons
      • Devicons
      • Font Awesome 5
      • Font Awesome 6
      • Flat Color Icons
      • Feather
      • Game Icons
      • Github Octicons icons
      • Grommet-Icons
      • Heroicons
      • Heroicons 2
      • IcoMoon Free
      • Ionicons 4
      • Ionicons 5
      • Icons8 Line Awesome
      • Lucide
      • Material Design icons
      • Phosphor Icons
      • rocketicons
      • Remix Icon
      • Radix Icons
      • Simple Icons
      • Simple Line Icons
      • Tabler Icons
      • Themify Icons
      • Typicons
      • VS Code Icons
      • Weather Icons
    • Roadmap

    Copyright © 2024 rocketclimb

    DiscordGitHub

    Usage

    Add exactly what you need

    Already ran npx rocketicons init? Great. Pick an exact icon ID in the icon explorer, then add that one component:

    terminal

    The current command accepts one icon at a time. For a small set, keep the steps explicit and repeat it:

    terminal

    Each command creates one TSX file under src/ri/icons. That is the useful bit: your application owns the selected component instead of importing a package full of icons.

    Import the generated component

    TS
    ESM
    CommonJS

    Render it like any other React component. Tailwind-compatible icon utilities control its color and size:

    Verify before moving on

    After the command, check that src/ri/icons/rc-rocket-icon.tsx exists and review it with your normal version-control tools. Commit generated icon files with the feature that uses them so teammates, CI, and offline builds all receive the same source.

    The current add command overwrites its target file. If you edited a generated icon by hand, review or preserve that work before running the command again.

    Ready to make it yours? Explore Colors, Dark mode, Sizing icons, and Styling.