Skip to content
This repository has been archived by the owner before Nov 9, 2022. It is now read-only.

muffinresearch/payment-icons

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
min
 
 
svg
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Note: This package is no longer maintained

npm version Build Status

Payment-icons

Payment related svg icons for use in fonts or spritesheets.

Usage

The raw .svg output (from a mix of sketch and inkscape) is in the svg directory. The minified svg output is in the min dir.

The easiest way to consume these icons is to npm install from github and use your favorite toolchain to build fonts or sprites e.g.

yarn add payment-icons

or

npm install payment-icons

How to use in something like react?

You'll need to use the svg like you do any other image asset. Exactly how will depend on what you're using in your build process.

If you're using webpack for example, then as long as your loader config understands svg you can import like you would with any other image. Here's an example for doing that (this is from create-react-app which uses webpack)

Doing it that way you'll need to find the path from node_modules/payment-icons/ so if you're looking for the flat visa icon that should be something like this:

import visa from 'payment-icons/min/flat/visa.svg';

Icon Demo

Examples generated with svg-sprite can be seen here: http://muffinresear.ch/payment-icons/

Contributing icons

If you want to remix these icons, have at it. If you have additional icons you want to be included then please follow the examples given and add your icon for each of the existing styles and make a pull request.

CLI

Note: This CLI is only relevant for development or maintenance purposes.

  • yarn run build - creates minified SVG.
  • yarn run publish - builds the sprite and publishes it to github pages.

License

Icon marks are copyright their respective owners.

The rest of the code here is MPL2.0.