Skip to main content

Bottts

Sean Moore Lionel Quinn Lydia Ellis Bryan Phelps Ronald Frank Annette Klein Brent Hill Stanley Newman Grace Singleton

Designed by Pablo Stanley. The Sketch library can be found on bottts.com.

Usage#

HTTP-API (recommended)#

Our free HTTP-API is the easiest way to use this avatar style. Just use the following URL as image source.

https://avatars.dicebear.com/api/bottts/:seed.svg

See the HTTP API documentation for more information.

NPM#

Install the Avatars and this avatar style with the following command.

npm install --save @dicebear/avatars @dicebear/avatars-bottts-sprites

Now you are ready to create your first Avatar.

import { createAvatar } from `@dicebear/avatars`;
import * as style from `@dicebear/avatars-bottts-sprites`;
let svg = createAvatar(style, {
seed: 'custom-seed',
// ... and other options
});

Options#

Base options#

seed

Seed

Alias: s

Default: undefined

Type: string

dataUri

Data URI

Default: false

Type: boolean

radius

Radius

Alias: r

Default: 0

Type: integer

Minimum: 0

Maximum: 50

width

Width

Alias: w

Default: undefined

Type: integer

Minimum: 1

height

Height

Alias: h

Default: undefined

Type: integer

Minimum: 1

margin

Margin

Alias: m

Default: 0

Type: integer

Minimum: 0

Maximum: 25

backgroundColor

Background Color

Alias: b

Default: transparent

Type: string

Pattern: ^#([a-fA-F0-9]{3}|[a-fA-F0-9]{4}|[a-fA-F0-9]{6}|[a-fA-F0-9]{8})+$

or

Type: string

Enum: transparent

Style options#

colors

Colors

Default: undefined

Type: array

Items:

Type: string

Enum: amber, blue, blueGrey, brown, cyan, deepOrange, deepPurple, green, grey, indigo, lightBlue, lightGreen, lime, orange, pink, purple, red, teal, yellow

colorful

Use different colors for body parts

Default: undefined

Type: boolean

primaryColorLevel

Primary Color Level

Default: 600

Type: integer

Enum: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900

secondaryColorLevel

Primaray Secondary Level

Default: 400

Type: integer

Enum: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900

textureChance

Texture Probability

Default: 50

Type: integer

Minimum: 0

Maximum: 100

mouthChance

Mouth Probability

Default: 100

Type: integer

Minimum: 0

Maximum: 100

sidesChance

Sides Probability

Default: 100

Type: integer

Minimum: 0

Maximum: 100

topChance

Top Probability

Default: 100

Type: integer

Minimum: 0

Maximum: 100