Icons

Bonik uses two icon libraries:

1. Custom SVG icons from public/assets/images/icons
2. Tabler Icons (opens in a new tab) via the @tabler/icons-react package

The Tabler Icons library provides over 3,400 open source icons that can be used alongside our custom SVG icons.

Using Icon

Bonik rendered svg files using the React SVG (opens in a new tab) package.

import Icon from '@component/icon/Icon'
 
const Example = () => {
  return (
    <Icon className="caret-icon" variant="small" defaultcolor="currentColor">
      chevron-right
    </Icon>
  )
}