React/SVG icon library for BI Design System
npm install @bi-digital/iconsBI specific icons. Available as React components and raw SVGs.
Install the icons and the required CSS tokens: npm i @bi-digital/icons@latest @bi-digital/tokens
Then add the styles, either in a CSS-file:
``css`
@import '@bi-digital/tokens';
Or in jsx/tsx:
`ts`
import '@bi-digital/tokens';
> If you use @bi-digital/css, you don't have to install @bi-digital/tokens as well since it's included in @bi-digital/css.
`ts
import { CheckmarkIcon } from '@bi-digital/icons';
function App() {
return
}
`
> Tip: Use the title prop to make accessible icons, if the icon is purely decorative, use aria-hidden="true"
Each icon's width and height is default 1em. This allows you to use the native fontSize-prop to adjust sizing. You can also use the size-prop to achive the same.
`jsx`
The icons are also available in raw SVG-format behind /svg. Note that svg-files do not have the suffix Icon and are in kebab-case:
`js``
import ArrowRightIcon from '@bi-digital/icons/svg/arrow-right.svg';
There are several icons available, view all and read the docs at designsystem.bi.no.