Skip to content

JS/TS tool for rescaling and place SVG in a cover mode in SVG with specified size

License

Notifications You must be signed in to change notification settings

MNBuyskih/svg-center

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

42 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

SVG Icon Center

Before After

Publish to NPM

This is a helpful tool for preparing your SVG icons to use in font generators. For generating custom fonts your icons should be placed in the center of square SVG. This tool tries to solve this issue of custom icons: wrong sizes and places.

Usage

Add this package to your project

yarn add svg-icon-center # or npm install svg-icon-center

You can use it in both: JS and TS languages

import {svgCenter} from "svg-icon-center";

svgCenter("<svg>...</svg>", 36, 36).then(newSvg => console.log(newSvg))

API

There is only one available function: svgCenter. Params:

  • sorceSvg svg as string
  • width - new svg file width
  • height - new svg file height

CLI

Usage: svg-icon-center [options]

Options:

  • -s, --source [pattern] glob pattern for svg dir/file/files
  • -o, --output [path] output directory
  • -w, --width [number] output svg width (default: "36")
  • -h, --height [number] output svg height (default: "36")

Example: svg-icon-center -s src/test/svg/*.svg -o src/test/svg/dist -w 24 -h 24

Limitation

This is a beta version and currently supports only SVG files, that contains only one path element.

Please contribute/let_us_to_know if you find any broken image.

License

MIT

About

JS/TS tool for rescaling and place SVG in a cover mode in SVG with specified size

Resources

License

Stars

Watchers

Forks

Packages

No packages published