{"library":"react-bootstrap-icons","title":"React Bootstrap Icons","description":"react-bootstrap-icons is a specialized library that provides the entirety of the Bootstrap Icons collection as individual, configurable React components. Currently, on version 1.11.6, it supports Bootstrap Icons v1.13.1, offering over 2000 SVG icons for use in React applications. The library is actively maintained, with updates typically aligning with new releases of the upstream Bootstrap Icons library. Its primary differentiator is the direct conversion of each icon into a callable React component, allowing for easy integration and customization via standard React props like `color`, `size`, and `className`. It also ships with TypeScript types, enhancing developer experience by providing strong typing for icon names and component props. Unlike generic SVG icon libraries, it is exclusively focused on the Bootstrap Icons set.","language":"javascript","status":"active","last_verified":"Tue Apr 21","install":{"commands":["npm install react-bootstrap-icons"],"cli":null},"imports":["import { ArrowRight } from 'react-bootstrap-icons';","import * as Icon from 'react-bootstrap-icons';","import { IconProps } from 'react-bootstrap-icons';","import * as icons from 'react-bootstrap-icons';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import React from 'react';\nimport { Stopwatch, PaletteFill, Star } from 'react-bootstrap-icons';\n\nexport default function MyIconDisplay() {\n  return (\n    <div style={{ display: 'flex', alignItems: 'center', gap: '1rem' }}>\n      <Stopwatch\n        color=\"teal\"\n        size={48}\n        className=\"my-custom-icon stopwatch-timer\"\n        title=\"Time tracking icon\"\n      />\n      <PaletteFill\n        color=\"#8A2BE2\" \n        size={96}\n        className=\"my-custom-icon color-picker\"\n        title=\"Color palette\"\n      />\n      <Star\n        color=\"gold\"\n        size={32}\n        className=\"my-custom-icon rating-star\"\n        title=\"Rating star\"\n      />\n      <p>\n        These are some example Bootstrap icons rendered as React components with custom styling and accessibility titles.\n      </p>\n    </div>\n  );\n}","lang":"typescript","description":"Demonstrates importing and rendering multiple Bootstrap Icons components with inline props for color, size, className, and accessibility titles.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}