gridy-avatars
Gridy Avatars

SVG avatars generator
Demo
Try randomize button here.
Usage
- see exported API in ./src/avatars.js
- use ./dist/avatars.js
- see ./dist/index.html for example usage (with Vue.js)
Development
yarn- edit ./src/avatars.svg in Inkscape (use one layer per feature)
npm run dev- copy generated shapes from dev web app to ./shapes.json
npm run build
Notes
- 86 = 262.144 variants
- based on 24×24 pixels grid
- using Material Design colors (generated in ./src/colors.js)
- no transparent colors
- utilizing SVG clipPaths (with fully opaque colors)
- no dependencies
- inspired by Gabfranck/svg_avatar
Related Packages
bloub-to-vue-and-react
SVG recreation of the x.ai bot avatar. One shape morphing through 14 states, mea...
330
1,854
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 1.1.3 | ^2.5.11 | MIT | |
| 1.1.2 | ^2.5.11 | MIT | |
| 1.1.1 | ^2.5.11 | MIT | |
| 1.1.0 | ^2.5.11 | MIT | |
| 1.0.7 | ^2.5.11 | MIT | |
| 1.0.6 | ^2.5.11 | MIT | |
| 1.0.5 | ^2.5.11 | MIT | |
| 1.0.4 | ^2.5.11 | MIT | |
| 1.0.3 | ^2.5.11 | MIT | |
| 1.0.2 | ^2.5.11 | MIT | |
| 1.0.1 | ^2.5.11 | MIT | |
| 1.0.0 | ^2.5.11 | MIT |