Shapes ​

This implementation is a remix of Shapes by Florian Körner. Licensed under CC0 1.0.

Usage ​

Options ​

seed #

The seed determines the initial value for the built-in PRNG. With the PRNG you can create the same avatar over and over again based.

flip #

rotate #

scale #

radius #

size #

backgroundColor #

backgroundType #

backgroundRotation #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as the rotation degree. The rotation is only visible if backgroundType is set to ['gradientLinear'].

translateX #

translateY #

clip #

randomizeIds #

This option randomize the IDs in the generated SVG / XML. This can be useful for example if the avatars are included directly in the HTML and you want to avoid ID collisions.

shape1 #

shape1Color #

shape1OffsetX #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape1OffsetY #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape1Rotation #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as the rotation degree.

shape2 #

shape2Color #

shape2OffsetX #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape2OffsetY #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape2Rotation #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as the rotation degree.

shape3 #

shape3Color #

shape3OffsetX #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape3OffsetY #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as offset.

shape3Rotation #

Specify an array of two numbers for this option. The PRNG will generate a number between the two values, which will be used as the rotation degree.

Details ​

import { shapes } from '@dicebear/collection';

import * as style from '@dicebear/shapes';

dicebear shapes