Skip to content

An SVG-based identicon visual hash, generated via internal javascript.

License

Notifications You must be signed in to change notification settings

misaki-web/solacon

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

About Solacon

A solacon is a variation of an identicon, in the form of a solar/spiral/floral shape. This is also known as a visual hash.

The solacon is seeded with a value (string) which determines the shape, symmetry, and shades of the image.

Examples

Solacon examples

Form

The HTML file contains a form allowing to customize the image generation:

  • Random color: If checked, a new color will be used for each image generation.
  • Background: We can choose between no background (image with transparency), a white background or a colored background (shade of the main colour).
  • String: If filled, the string will be used to generate the solacon. If empty, a random string will be used.

At the end of the form, there are buttons to generate a new image or to download the solacon in PNG or SVG format.

Solacon form

GET variables

The image generation can also be customised using GET variables in the URL. Here is the list of all variables that can be used:

  • string=TEXT where TEXT is the string used to generate the solacon. Example: string=lorem.
  • color=COLOR where COLOR is the color of the solacon. Hex colors and RGB colors can be used. Examples: color=#326496, color=326496, color=50,100,150, color=rgb(50,100,150).
  • background=TYPE where TYPE is white or colored.
  • size=SIZE where SIZE is the width and height in px. Example: size=512.
  • download=TYPE where TYPE is png or svg. The image download will start automatically without having to click on the download button.

Examples:

  • index.html?string=hujMdpAtoaDztvZ&color=b079b4
  • index.html?string=Lorem%20Ipsum&color=326496&background=white&download=png

JavaScript

The parent document can alter the solacon:

var svgObj = document.getElementById('svg-obj');
svgObj.setRGB('100, 150, 200');
svgObj.generate('some new value');
svgObj.setRGB();         // random color
svgObj.generate();       // random seed value
svgObj.setRGBFromHash(); // color is based off hashValue (default behavior)
svgObj.refresh();        // applies color change to current shape

Server script

The file server-script/solacon.sh illustrates how to get solacon images on a server, without user interaction.

Run solacon.sh -h for more details.

Live demo

Try out some dynamical examples of solacons in action.

Similar projects

License

Copyright (c) 2022 Jon Van Oast https://github.com/naknomum
Copyright (C) 2023 Misaki F. https://github.com/misaki-web

Released under MIT License. See the file LICENSE for more details.

Releases

No releases published

Languages

  • HTML 50.2%
  • Shell 43.1%
  • PHP 6.6%
  • Smarty 0.1%