gem-hunter

React Bootstrap Icons

Installation

npm install react-bootstrap-icons --save

yarn add react-bootstrap-icons

Usage

import { ArrowRight } from 'react-bootstrap-icons';

export default function App() {
  return <ArrowRight />;
}

<ArrowRight color="royalblue" size={96} />

<ArrowRight className="ml-4" />

import * as Icon from 'react-bootstrap-icons';

export default function App() {
  return <Icon.ArrowRight />;
}

import * as icons from 'react-bootstrap-icons';

interface IconProps extends icons.IconProps {
  // Cannot use "name" as it is a valid SVG attribute
  // "iconName", "filename", "icon" will do it instead
  iconName: keyof typeof icons;
}

export const Icon = ({ iconName, ...props }: IconProps) => {
  const BootstrapIcon = icons[iconName];
  return <BootstrapIcon {...props} />;
}

import { Icon } from './Icon';

export default function App() {
  return (
    <Icon
      iconName="Stopwatch"
      color="royalblue"
      size={96}
      className="align-top"
    />
  );
}

IconProps

Figma Plugin

More options

License

Collaborators