Skip to content

Instantly share code, notes, and snippets.

@OllyHodgson

OllyHodgson/Icon.js

Created Jul 31, 2020
Embed
What would you like to do?
React component to use the Bootstrap 5 Icons in sprite form
import React from "react";
import classnames from "classnames";
import Icons from "bootstrap-icons/bootstrap-icons.svg";
const Icon = ({
className,
iconName,
height = "1rem",
width = "1rem",
label,
}) => {
const iconHref = `${Icons}#${iconName}`;
return (
<>
<svg
className={classnames("bi", `bi-${iconName}`, className)}
width={width}
height={height}
fill="currentColor"
role="img"
focusable="false"
>
<use xlinkHref={iconHref} />
</svg>
{label && <span className="sr-only">{label}</span>}
</>
);
};
export default Icon;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment