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