# @avatar-generator

> @avatar-generator is an open-source (MIT) JavaScript and TypeScript library that generates deterministic SVG avatars from any seed string. It has eleven styles, each in its own package, no runtime dependencies, and official components for React, Vue, Svelte and Angular, plus a custom element.

The complete documentation as one file: https://avatar-generator.hugoogb.dev/llms-full.txt

## Get started

- [Compare JavaScript Avatar Libraries](https://avatar-generator.hugoogb.dev/get-started/comparison/): How @avatar-generator compares with DiceBear, Boring Avatars and Jdenticon on styles, licensing, framework support and requirements, and when to choose each.
- [Install the Avatar Generator](https://avatar-generator.hugoogb.dev/get-started/installation/): Install @avatar-generator v3 from npm: the core package, one or more avatar styles, and an optional React, Vue, Svelte or Angular wrapper.
- [What Is @avatar-generator?](https://avatar-generator.hugoogb.dev/get-started/introduction/): An open-source JavaScript library that generates deterministic SVG avatars from any seed, with eleven styles, no runtime dependencies and SSR support.
- [Avatar Generator Playground](https://avatar-generator.hugoogb.dev/get-started/playground/): Try every @avatar-generator style in your browser: type a seed and watch eleven SVG avatars update, or run the six local playgrounds.

## Guides

- [Angular Avatar Component](https://avatar-generator.hugoogb.dev/guides/angular/): Generate SVG avatars in Angular 17 through 21 with the standalone @avatar-generator/angular component, or use it from an NgModule.
- [Avatar Recipes and Patterns](https://avatar-generator.hugoogb.dev/guides/cookbook/): Recipes for real-world avatars in JavaScript: avatar groups, image fallbacks, theming, caching and server-side rendering.
- [Create a Custom Avatar Style](https://avatar-generator.hugoogb.dev/guides/custom-styles/): Build your own avatar style for @avatar-generator, from the Style<T> interface to publishing the package on npm.
- [Generate SVG Avatars in JavaScript](https://avatar-generator.hugoogb.dev/guides/manual/): Generate SVG avatars in plain JavaScript or TypeScript with createAvatar from the core package, including shared options and each style's options.
- [React Avatar Component](https://avatar-generator.hugoogb.dev/guides/react/): Generate deterministic SVG avatars in React 18 and 19 with the @avatar-generator/react component, with correct memoization and typed style options.
- [Svelte Avatar Component](https://avatar-generator.hugoogb.dev/guides/svelte/): Generate deterministic SVG avatars in Svelte 4 and Svelte 5 apps with the @avatar-generator/svelte component.
- [Vue Avatar Component](https://avatar-generator.hugoogb.dev/guides/vue/): Generate deterministic SVG avatars in Vue 3 applications with the @avatar-generator/vue component.
- [Avatar Web Component](https://avatar-generator.hugoogb.dev/guides/web-component/): Generate SVG avatars from any HTML page or framework with <avatar-generator>, a framework-agnostic custom element.

## Reference

- [Avatar Generator API Reference](https://avatar-generator.hugoogb.dev/reference/avatar/): Complete API reference for @avatar-generator: createAvatar, every shared option and type, and the options of each avatar style.
- [Avatar Configurator](https://avatar-generator.hugoogb.dev/reference/configurator/): Pick an avatar style, adjust every option with form controls, and copy the exact createAvatar() call for your configuration.
- [Avatar Style Gallery](https://avatar-generator.hugoogb.dev/reference/gallery/): Compare all eleven @avatar-generator styles side by side, from initials and identicons to pixel art, anime faces and animals.
- [Migrate to @avatar-generator v3](https://avatar-generator.hugoogb.dev/reference/migration/): Upgrade to @avatar-generator v3 from v2 or from the original v1 element API, with the changes you need to make at each step.
- [Versions & Support](https://avatar-generator.hugoogb.dev/reference/versioning/): Which @avatar-generator versions are supported, what the version numbers mean, and why v1 and v2 should not be installed.