A React library is available to install under the name healthicons-react. For more details, see the package README.

A React Native library is available to install under the name healthicons-react-native. For more details, see the package README.

A Vue library is available to install under the name healthicons-vue. For more details, see the package README.

Import the CSS File:

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/stnrd/healthicons@main/css/healthicons.css"
/>

Here is an example in HTML:

<i class="healthicons-filled-blood-bag"></i>

The class must always be "healthicons-" following by the icon type(filled, outline) if you use the combined one. We have separate css files for the different icon variants. You can find the names of the icons here.

The icons are set to be displayed as inline-block and will use the current font size as their default. To modify this behavior, you can make changes to the ::before styles of the element where the icons are applied as a mask.

I would like to extend my gratitude to the creators and contributors of the Health Icons for their hard work in releasing such a comprehensive collection of icons for use in healthcare related projects.

MIT License