gridy-avatars

SVG avatar generator
6,526 72
Install
npm install gridy-avatars
Latest Version:1.1.3
Vue:2
License:MIT
Last Updated:Apr 8, 2018
Links: GitHub  ·  npm
Maintainer: darosh

Gridy Avatars npm (scoped) demo Try gridy-avatars on RunKit

SVG avatars generator

sample 1sample 2sample 3sample 4sample 5

Demo

Try randomize button here.

Usage

Development

  1. yarn
  2. edit ./src/avatars.svg in Inkscape (use one layer per feature)
  3. npm run dev
  4. copy generated shapes from dev web app to ./shapes.json
  5. 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

vuevectormap

A Vue wrapper component for Jsvectormap

110,025 10
planet-avatar

Deterministic planet-style SVG avatars for vanilla JS, React, and Vue.

3,152
@awflow/avatar-vue

Deterministic SVG avatars from a name, as a Vue component.

560 0
bloub-to-vue-and-react

SVG recreation of the x.ai bot avatar. One shape morphing through 14 states, mea...

330 1,854
@blobatar/vue

Vue 3 adapter for blobatar — deterministic geometric avatars.

7,129 1,551

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