waseigo
IdenticonSvg - Generates identicons in SVG format, so they can be inlined in HTML
I wrote IdenticonSvg because I like using identicons as visual identifiers of HTML listings, e.g. in grids or in table rows, and didn’t want to deal with generating identicons in PNG and loading them from files or as base64-encoded data.
IdenticonSvg exposes a single generate/4 function that generates the SVG code of the identicon for the specified text argument, optionally with different identicon size, background color, and/or opacity.
Without specifying any optional arguments this function generates a 5x5 identicon with a transparent background and colored grid squares with full opacity.
Optionally, specify any combination of the following arguments:
size: the number of grid squares of the identicon’s side; integer, 4 to 10; 5 by default.bg_color: the color of the background grid squares; string, hex code (e.g.,#eee);nilby default.opacity: the opacity of the entire identicon (all grid squares); float, 0.0 to 1.0; 1.0 by default.
Setting bg_color to nil (default value) generates only the foreground (colored) squares, with the default (1.0) or requested opacity.
The color of the grid squares is always equal to the three first bytes of the hash of text, regardless of which hashing function is used automatically.
A different hashing function is used automatically for each identicon size, so that the utilization of bits is maximized for the given size: MD5 for sizes 4 and 5, RIPEMD-160 for 6, and SHA3 for 7 to 10 with 224, 256, 384 and 512 bits, respectively.
The package is available on Hex.
The documentation is available on HexDocs.
The source code is on GitHub.
Any related posts (none yet) will be found on my blog.
Most Liked
waseigo
New since v0.8.0: Setting bg_color to one of the following 3 atom values sets the color of the background squares to the corresponding RGB-complementary color of the automatically-defined foreground color, with the default (1.0) or requested opacity:
:basic: the complementary color, i.e. the opposite color offg_coloron the color wheel.:split1: the first adjacent tertiary color of the complement offg_coloron the color wheel.:split2: the second adjacent tertiary color of the complement offg_coloron the color wheel.
waseigo
v0.9.4 brings squircle cropping to the identicons, using the Squircle module.
iex> IdenticonSvg.generate("IdenticonSvg", 5, :basic, 0.8, 2, squircle_curvature: 0.8) |> IO.puts
<svg xmlns="http://www.w3.org/2000/svg" shape-rendering="crispEdges" viewBox="0 0 9 9" height="100%" width="100%" version="1.2"><defs><pattern id="agdwh2" patternUnits="userSpaceOnUse" width="9" height="9"><g transform="translate(2,2)"><path style="fill:#22f7b3;fill-opacity:0.8;" d="M0 0h1v1h-1zM4 0h1v1h-1zM0 1h1v1h-1zM4 1h1v1h-1zM0 2h1v1h-1zM2 2h1v1h-1zM4 2h1v1h-1zM1 3h3v1h-3zM1 4h1v1h-1zM3 4h1v1h-1z"/><defs><mask maskContentUnits="userSpaceOnUse" id="z8mq5b8i4n"><path style="fill-opacity:0.8;fill:#fff;" d="M-2 -2h9v9h-9z"/><path style="fill-opacity:1;" d="M0 0h1v1h-1zM4 0h1v1h-1zM0 1h1v1h-1zM4 1h1v1h-1zM0 2h1v1h-1zM2 2h1v1h-1zM4 2h1v1h-1zM1 3h3v1h-3zM1 4h1v1h-1zM3 4h1v1h-1z"/></mask></defs><path mask="url(#z8mq5b8i4n)" style="fill-opacity:1; fill:#DD084C;" d="M-2 -2h9v9h-9z"/></g></pattern></defs><path d="M0 4.5C0 0.9 0.9 0 4.5 0S 9 0.9 9 4.5 8.1 9 4.5 9 0 8.1 0 4.5" transform="" fill="url(#agdwh2)"/></svg>
:ok
ku1ik
This is great! I want to replace gravatars with SVG based generated icons and this is exactly what I planned to implement, until I found your library. Thanks for building it 
ku1ik
Works great, well done!
Indeed the only thing I’d add is automatic background color.
I’m using gravatar, see this page Featured recordings - asciinema.org which displays author avatars at the bottom of each card using gravatar’s “retro” style. After replacing them with IdenticonSVG I realized the colored background in the gravatars gave it a more “complete” feel compared to the new identicon look.
For now I’ll probably use default transparent background, or a fixed color. I can look into implementing some automatic background mode in your library, and open a PR if I get anywhere with it and you’d be interested in such contribution.
waseigo
Almost done.
Popular in Libraries
Other popular topics
Latest on Elixir Forum
Sponsor Spotlight
Develop your skills with books, videos, and courses.
Categories:
Sub Categories:
Forums
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Practical resources that improve the lives of professional developers.
Enabling companies to succeed by building software people love.
The deployment platform built for Elixir: PaaS ease, VPS control.
Courses that'll move you from confusion to "Aha, now I get it!"