React Native Paper Icons repository

Question

I have struggled a lot to figure out the repository being used in react native paper for Icons, using react native paper designing APP becomes very easy but figuring out Icon names was a bit struggle.

https://callstack.github.io/react-native-paper/icons.html – maltoze Jan 21 '21 at 06:25 — maltoze, Jan 21 '21 at 06:25

score 3 · Answer 1 · answered Aug 01 '20 at 07:17

React Native Paper uses Material Community Icons as default, it is a bit difficult to figure out the Icon names, below is the CDN URL for cheatsheet, just remove mdi- from any icon name at Valla it works!!

https://cdn.materialdesignicons.com/5.4.55/

example:- in cheatsheet name is mdi-comment-outline, remove mdi- from this name thats it!!

<List.Item
    title="First Item"
    description="Item description"
    left={props => <List.Icon {...props} icon="comment-outline" />}
  />

More visible site: https://materialdesignicons.com And conversion still works, for example: 'mdiAcountPlus' -> 'account-plus' — bieboebap, Aug 23 '22 at 21:16

score 1 · Answer 2 · answered Aug 10 '22 at 20:50

It uses Material Design Icons as an icon library, if you want to add icons then this technique will definitely work:

Visit https://materialdesignicons.com/
Click on any icon, and above there will be import Statement/Line for eg like: import { mdiAccountSchool } from '@mdi/js';.
just convert mdiAccountSchool => account-school.

This will definitely work!

score 0 · Answer 3 · answered Aug 02 '20 at 17:51

0

I use this site : https://materialdesignicons.com/

Need to wait a few seconds then all icons will show Good search bar for quick searching

answered Aug 02 '20 at 17:51

l4rnaud

179
9

React Native Paper Icons repository

3 Answers3