Sprite Preview

Seeded avatars of little elemental spirits: flames and wisps, drops and blobs, boulders and gems, puffs and funnels, planets and stars, each with a face. Try them in the playground.

Sprite is a Preview style: until it's marked Stable, a seed's Sprite can change in a minor version.

Use

import { sprite, spriteDataUri } from 'seedkin/sprite';

const svg = sprite(user.id);
const src = spriteDataUri(user.id, { size: 40 });

// Pick the element yourself: the seed still picks the rest.
const team = sprite(user.id, { element: 'fire' });

A seed picks one of five elements (ELEMENTS), one of that element's two forms (FORMS), one of its palettes, eyes, a mouth, and sometimes cheeks. The seed is salted, so one id's Botling and Sprite are unrelated. Unlike the other styles, the salt goes after the seed, so ids that differ only in their last character, like user-1 and user-2, still draw different Sprites.

Options

sprite() takes the same options as snoot(), plus element: shape (default 'square'; the seed doesn't pick it), palette (an index into Sprite's PALETTES, or a palette object), size, detail, showGrid, look, frame, background, animate and title (default 'Sprite avatar'). Below 40px it draws a simpler 9x9 Sprite from the same traits.

Animation

With animate: true a Sprite flips through four frames: a flame's tip sways, a drop wobbles, a gem glints, and the embers, bubbles, pebbles and stars around it drift. It does the same below 40px. Like every style, it holds still for anyone who prefers reduced motion, and the still picture is the first frame.

Exports

traits, resolveTraits, grid and smallGrid (each takes a frame, 0 to 3), FRAME_COUNT, ELEMENTS, FORMS, EYES, MOUTHS, SHAPES, PALETTES and palettesFor(element, form) are exported as for Botling (see Advanced).