svg-icon-paths

Collection of SVG paths for icons.

Getting started

$ npm install svg-icon-paths

somewhere.js[x]

import edit from 'svg-icon-paths/edit'

export default function MyComponent () {
	return (
		<button><svg viewBox={edit.viewBox}><path d={edit}/></svg></button>
	)
}

somewhere.css

.toolbar {
  display: flex;

	& button {
	  width: 2em;
		height: 2em;
		padding: 0;
		margin-right: 0.2em;

		&:last-child {
			margin-right: 0;
		}
	}
}

Attributes

Some paths include a collection of recommended attributes:

import reveal from 'svg-icon-paths/reveal'

const attributes = Object.keys(reveal.attributes).map(k => `${k}="${reveal.attributes[k]}`).join(' ')
const svgSrc = `<svg viewBox="${edit.viewBox}"><path d={reveal} ${attributes}/></svg>`

Available paths:

docs/index.html