@mh.alijany/crypto-iconsdeprecated

A set of icons for all the main cryptocurrencies and altcoins, Whit tools such as Sharp & SvgJs to image processing and modifying SVG icons.

Usage no npm install needed!

<script type="module">
  import mhAlijanyCryptoIcons from 'https://cdn.skypack.dev/@mh.alijany/crypto-icons';
</script>

README

banner">

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-icons

Examples

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");