coin-icon

Cryptocurrency icons set

DEMO

---

install

npm i coin-icon

Glossary

• CoinIcon
• Add new icon

CoinIcon

Optimazed way to use icons, since the icon is loading through URL.

Gettting started

1. Fist of all you need to define the path for storing icons files. For example - images/svg;
2. Copy all svg icons from svg (github repo) to your public folder 'images/svg;
3. Set up CoinIconProvider with public folder path:

<CoinIconProvider folderPath="'images/svg">
    <App />
</CoinIconProvider>

4. Import CoinIcon to your code:

import { CoinIcon } from 'coin-icon';

<CoinIcon code="btc" />;

Details

• Icon's width and heigth are equal to 1em by default. To change icon's size change the font-size of parent or current tag.
• Contains all properties declared in HTMLAttributes<HTMLDivElement> interface from @types/react package and custom properties described below:

Property	Type	Required	Description
code	CoinIconCode	No	TypeScript literal type of icon code
url	string	No	Image URL. For a case, when icon for a code is missing

Add new icon

1. Add new svg file into svg folder

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
    <title>new-coin</title>
    ...
</svg>

Make sure that width and height property are removed.

2. Add to src/interfaces/index.ts file:

export const CoinIconNameList = [
    ...
    /* start */
    'new-icon',
    /* end */
    ...
];

4. Create Pull Request