@mh.alijany/crypto-icons v0.2.1
Based on the Cryptocurrency Icons
Table of Contents
About
The project contains almost 400 crypto currencies in the SVG format.
The project also have a generic icon for cryptocurrencies missing an icon here. and in addition some fiat currencies: USD, GBP, EUR, JPY, CNY, RUB.
You can use tools such as Sharp & Svg.Js to image processing and modifying SVG icons to Create your desired output.
Install
npm i @mh.alijany/crypto-iconsExamples
import { cryptoIcons, lightTheme } from "@mh.alijany/crypto-icons";Use default themes :
cryptoIcons()
.operation(lightTheme(1024))
.saveSVG("./images");Filter and save the icons :
cryptoIcons()
.filter((coin) => coin.name == "Bitcoin")
.saveManifest("./dir")
.reload()
.filter((coin) => coin.color == "#eab304")
.saveSVG("./images");Use SVG.js to manipulate SVG elements :
Note : this works in Node.Js environment
Note : The SVG.Box functions are currently unavailable
cryptoIcons()
.modifySVG((svgJs) => {
svgJs.height(200);
svgJs.width(200);
})
.saveSVG("./images");Use sharp to image processing :
cryptoIcons()
.filter((coin) => coin.name == "Bitcoin")
.sharp((sharpInstance) => sharpInstance.toFile("btc-bitcoin.png"));Coins Model Overview
In this project, each Coin is an object that includes the name , symbol , id , color and svg of the Coin.
The id is a combine of symbol-name which is lower case and its spaces have been replaced by dashes.
for example:
const Coin = {
id: "btc-bitcoin",
symbol: "BTC",
name: "Bitcoin",
color: "#f7931a",
svg:
'<svg height="32" width="32" xmlns="http://www.w3.org/2000/svg">...</svg>',
};Api
cryptoIcons(): CryptoIcon
create new instance of CryptoIcon
import { cryptoIcons } from '@mh.alijany/crypto-icons';
const instance = cryptoIcons();saveManifest(path: string, name?: string, callback?: Function) : CryptoIcon
Writes a JSON file that contains an array of Coin objects
| Parameter | Description |
|---|---|
| path | directory to write output |
| name | name of the output file (default is manifest.json) |
| callback | map function to customize the default Coin |
example:
cryptoIcons()
.saveManifest(
"./dir",
"manifest.json",
coin => coin
);modifySVG(callback: Function): CryptoIcons
Process SVG image whit sharp
| Parameter | Description |
|---|---|
| callback | function whit an instance the sharp as parameter |
example:
cryptoIcons()
.sharp((sharpInstance, coin) => {
sharpInstance.toFile(`${coin.id}.png`)
});filter(callback: Function): CryptoIcons
Filter the coins that meet the condition specified in a callback function.
| Parameter | Description |
|---|---|
| callback | test function that Return true to keep the element, false otherwise. |
example:
cryptoIcons()
.filter((coin) => coin.name.startsWith("Bit"));saveSVG(path: string, name?: Function): CryptoIcons
Write the svg file of each Coin object in specified path
| Parameter | Description |
|---|---|
| path | directory to write output |
| name | callback that return the name of the output file (default is coin.id.svg) |
example:
cryptoIcons()
.saveSVG("./dir", (coin) => `${coin.id}.svg`);reload(): CryptoIcons
Reload all of the Coin objects
example:
cryptoIcons()
.reload();operation(operation: Operation): CryptoIcons
this function accept an operation as arguments which can be used for styling the icons. Several operation have been written which accept the icon size as an argument.
Default operators:
- lightTheme
- darkTheme
- grayTheme
example:
cryptoIcons()
.operation(lightTheme(1024))
.saveSVG("./images");