Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/incubated-geek-cc/svg2symbol
A browser utility tool to transform multiple svg images at once into symbol icons for inline-svg use.
https://github.com/incubated-geek-cc/svg2symbol
svg-icons svg-sprites svg-util ui-design web-design web-development-tools
Last synced: about 2 months ago
JSON representation
A browser utility tool to transform multiple svg images at once into symbol icons for inline-svg use.
- Host: GitHub
- URL: https://github.com/incubated-geek-cc/svg2symbol
- Owner: incubated-geek-cc
- Created: 2020-11-06T12:28:37.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-10-12T21:25:16.000Z (about 2 years ago)
- Last Synced: 2023-03-05T17:22:33.751Z (almost 2 years ago)
- Topics: svg-icons, svg-sprites, svg-util, ui-design, web-design, web-development-tools
- Language: JavaScript
- Homepage: https://svg2symbol.glitch.me
- Size: 26.9 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# svg2symbol
## A utility tool to convert your svg images into symbols - Generate your symbol definitions by importing your svg files.
### Deployed at https://svg2symbol.glitch.me/
### Backup site: https://svg2symbol.onrender.com/
### Basic Table of Comparison: Font Icons vs Inline SVG Use
| | Font Icon Use | Inline SVG Use |
| :------ | :-: | :-: |
| File Size | ✓ when no. of icons are significantly more, overall file size is relatively smaller | |
| Accessibility | | ✓ more built-in tags and read as image, not text by browsers |
| Performance | | ✓ less prone to loading errors |
| Scalability | | ✓ resolution independent;no effect on pixel quality when height/width changes |
| Animations | | ✓ more built-in tags and each component can be animated;greater versatility |
| Ease of Use | ✓ when only a few icons are required, the template setup is easier | ✓ when many icons are required and repeated use is common, the template setup is relatively less of a hassle |
| Browser Support | ✓ suited for legacy browsers such as IE9+ | ✓ requires polyfills to be rendered in legacy browsers |
### Published in https://geek-cc.medium.com/transforming-svg-files-into-symbols-for-svg-inline-use-no-internet-required-4cd7c9c84bae
#### Preview of Web Application
#### Enables multiple svg file imports at one go
#### Displaying embedded code snippets for each icon generated
#### Includes implementation guide for each exported file (exports 2 files)
