React Native Heroicons

Heroicons are designed by Steve Schoger and published by Tailwind Labs.

A full directory of all available icons can be found here:

https://heroicons.com/

Installation

react-native-heroicons requires react-native-svg v9 or higher

yarn

yarn add react-native-heroicons react-native-svg

npm

npm i react-native-heroicons react-native-svg

Usage

Specific icons:

importReactfrom"react";import{View}from"react-native";import{SparklesIcon}from"react-native-heroicons/solid";import{SparklesIconasSparklesIconOutline}from"react-native-heroicons/outline";constApp=()=>{return(<View><SparklesIcon/><SparklesIconOutline/></View>);};exportdefaultApp;

Entire icon pack:

importReactfrom"react";import*asIconsfrom"react-native-heroicons/solid";constApp=()=>{return<Icons.SparklesIcon/>;};exportdefaultApp;

Customization

Icons can be adjusted with the size prop (default: 24):

import{SparklesIconasSparklesIconOutline}from"react-native-heroicons/outline";// ...<SparklesIconOutlinecolor="red"fill="black"size={42}/>;