Updates the identicon in a specified <svg> element.

jdenticon.updateSvg(element|selector[, hash|value[, config]])


The following example shows how to use the updateSvg method to render an icon on demand without using the data-jdenticon-value or data-jdenticon-hash attribute.

Update icon

<svg id="identicon" width="100" height="100">

<script src="https://cdn.jsdelivr.net/npm/jdenticon@3.3.0/dist/jdenticon.min.js"
    jdenticon.updateSvg("#identicon", "my value");


element|selector can be either an <svg> element or a CSS selector to an <svg> element. If the selector evaluates to multiple elements, all elements are updated.

If the second parameter hash|value contains a hexadecimal string of at least 11 characters it is considered a valid hash and used as base for the icon. If it contains any other value it is hashed using SHA1. If null or undefined is specified, or if the parameter is omitted, the function will in first hand look for a data-jdenticon-hash attribute on the element, in second hand for a data-jdenticon-value attribute.

config specifies an optional configuration object. If no configuration is specified, the global configuration is used. For backward compability this parameter can also be a padding value in the range 0.0 to 0.5.


This method does the same thing as jdenticon.update(), but with the difference that jdenticon.updateSvg() only supports updating <svg> elements. If only <svg> elements are used, jdenticon.updateSvg() is preferred since it provides better code optimization opportunities for bundlers, keeping your JavaScript bundle as small as possible.

The following priority order is used to resolve the icon configuration when the icon is drawn:

  1. config parameter passed to updateSvg()
  2. Configuration object passed to jdenticon.configure().
  3. jdenticon_config global variable.

See also