Avatar generator.
Turn a name into an initials avatar, or any text into a geometric or gradient one, the same every time for the same name.
Avatar generator.
Need the UI around it? With Pro, your AI agent builds the form, the result card and the rest of the page from a prompt.
Get ProHow it works
4 steps, no account. It runs in your browser and nothing is uploaded.
Add names
Type a name or paste a list, one a line; names and emails both work.
Pick a style
Choose initials, a gradient, shapes or pixels, then the shape, the palette and the letters.
Choose one
Press an avatar to see its SVG, JSX, data URI and img tag.
Save them
Download the chosen one as SVG, PNG or WebP at up to 512 pixels, or the whole list as a ZIP.
Related tools
More design tools. Every one free, in the browser.
Pricing
Build it with Pro
The tool is free. Pro adds 6,000+ blocks, premium templates and the MCP server, so your AI editor builds the product around it.
4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.
- Secure checkout via Stripe
- Code lives in your repo
- Keep what you've shipped if you cancel
- License terms
Questions and answers
Before you trust the result: what to know about the format, the limits, your data and the tools next to it.
Everything in it comes from a hash of the name: the hue, the angle of a gradient, where each shape falls. The name is trimmed and lowercased first, so Maya Chen and maya chen make the same avatar. Nothing random is involved, so a name gives the same picture on any device.
The first letters of the first and the last name: Ada King Lovelace becomes AL. A single name gives one letter, and an email uses the part before the @, split at dots and dashes, so maya.chen@example.com becomes MC. Choose One to always show a single letter.
In apps, before someone uploads a photo: user lists, comments, chat, team pages and mockups. Initials help people spot a colleague quickly; gradients, shapes and pixels suit anonymous accounts and test data.
The colors are picked in OKLCH, where every hue can have the same lightness, so no name gets a glaring yellow next to a muddy blue. Vivid, Deep and Mono always take white letters, and Pastel takes a dark shade of its own hue.
No. The avatars are SVGs built in your browser, and the PNGs and the ZIP are made on your device. The names you type stay on the page.
SVG is the smallest and stays sharp at any size; the JSX tab gives a React component and the data URI fits straight into an img tag. PNG or WebP suits places that want a bitmap, at 64 to 512 pixels.
Paste the list into Names, one person a line, up to 200. ZIP saves every avatar in the chosen format and size, each file named after its person, such as maya-chen.svg.
No. The Avatar generator is free and opens without a sign-in, an account or an install.
Closest to the Avatar generator: Placeholder image generator, SVG blob generator, SVG to PNG converter, Color converter. Each opens on its own page, free and in the browser.
The Avatar generator is one of 11 in its group. The group's page, /tools/design, lists them all.
The tool is free. Its interface is built from shadcn.io's own components (Button, Input, Slider and the rest of the registry under /ui), which come in React, Vue, Svelte and Solid. Pro adds the blocks and templates for the product around it.
4.9 out of 5 from 150+ developers
Build the product around it
Every block, template and icon, installed by your AI agent in your theme. The tools stay free.
Get Pro