# AI Iconography: Generating Icons Without Breaking the Set's Consistency

> A generator can propose icons fast, but a set needs stroke and grid rules, real SVG files, clear licensing and a legibility check before it ships.

*Tags: ai, iconography, design-system, image-generation*

---


> [!info] Quick Definition
> **AI iconography** is the creation of icons with generative models, starting from a written style. It helps explore and draft a set. Consistency, legibility, vector format and licensing still depend on rules and human review.


## Why is a consistent set hard?

An icon set is a system. Every icon shares stroke weight, corners, grid, visual height and fill logic. An image generator produces each icon separately and doesn't know that system. The result can look good in a sample grid and fall apart once it sits in a toolbar.

MagicShot's guide to generated icon sets puts it this way: a 2 px line next to a 1.5 px line "reads as a bug". Its recipe is to define the style as a reusable prompt block, generate three or four anchor icons and use them as the reference for the rest. It is a guide from a vendor of generators, not a standard, but it describes the problem well: without control, every icon comes out slightly different.

## Which rules should you set before generating?

Write a style sheet and use it in every prompt. The values below are examples, not norms:

- **Grid**: for example 24 px, with a defined live area and padding.
- **Stroke**: weight (such as 2 px), rounded or flat end caps, rounded corners or not.
- **Fill**: outline only, solid only or a mix, but one rule for the whole set.
- **Palette**: the stroke color and, if relevant, an accent color, in exact values.
- **What must not appear**: shadows, gradients, text inside the icon, details that disappear at 16 px.

Paste the block literally into every prompt: the model gets the same constraints even though it doesn't remember the previous session. The same style rules work for any image in a series, as explained in [[image-generation-for-design|image generation for design]] and [[consistent-ai-illustrations|consistent AI illustrations]].

## Which formats and licenses do the tools offer?

According to MagicShot, a typical generator produces high-resolution raster images, and production may require tracing or redrawing them. Some tools do deliver vectors. Here is what their official pages say, checked on November 2, 2026:

- **Adobe Illustrator, Text to Vector Graphic**: generates subjects, scenes and icons from a description. Adobe says the result is "fully editable, infinitely scalable" and lands on its own new layer, powered by its Firefly Vector Model, and describes it as safe for commercial use. That is Adobe's claim: check the terms of your plan.
- **Recraft**: its API documentation describes vector image generation. The example with the `recraftv4_1_vector` model returns a link to an SVG file that stays valid for about 24 hours, so download it promptly. The docs present the V2 model as the cheapest vector option, "for icons and simple illustration", and a feature called Vectorize that turns a PNG or JPG into SVG for $0.01.
- **Recraft's license**: under its terms, "no commercial use" is permitted on the free plan and the results belong to Recraft. On a paid subscription, you own what you create. Use of your results to improve the service is on by default, and you can opt out in your account settings.

If you don't need to generate, there is another route: start from an open library. **Material Symbols** is a variable font with axes for fill (0 to 1), weight (100 to 700), grade and optical size (20 to 48 dp), released under the Apache License 2.0. **Lucide** is released under the ISC License. With a variable font, stroke weight and optical adjustment are controlled by a parameter, so you don't depend on the model getting them right.

## How do you go from a sketch to a production-ready icon?

MagicShot proposes four steps: define the style, generate the anchors (home, search, profile, settings), generate the rest in a batch and cull whatever doesn't match, then export and clean up. In the last step it asks you to check the icons at 16, 24 and 48 px and fix optical sizing where a shape looks too big or too small next to its neighbors. On top of that base, add these checks yourself:

1. Discard anything that doesn't match the anchors in stroke and grid.
2. Ask for or convert to SVG, then open the file: confirm the shapes are editable paths and not an embedded image.
3. Redraw or clean up stray points in your design tool.
4. Review at real size, inside the interface and not on the large canvas.

Optical size matters as much as measured dimensions: according to MagicShot, a triangle in the same bounding box as a circle looks smaller. That adjustment is still human work.

## How do you check that an icon is understood?

Nielsen Norman Group (Aurora Harley, 2014) points out that universal icons are rare: home, print and the magnifying glass for search are the examples it gives. For the rest, "a text label must be present alongside an icon", visible at all times without any interaction. Don't rely on hover, because it translates poorly to touch screens.

The article suggests three checks:

- **The five-second rule**: if it takes you more than five seconds to think of an appropriate icon for a concept, the icon is unlikely to communicate it.
- **Recognizability**: ask people what they expect the icon to mean.
- **Memorability**: tell a group what the icon means and, a couple of weeks later, ask the same people whether they remember.

## Example

Illustrative example: a team needs twelve icons for a booking app. They write a style sheet with a 24 px grid, a 2 px stroke with rounded corners and outline only. They generate four anchors, approve one, and generate the rest. Of forty sketches, seven fit. Those seven are redrawn as vectors in the team's design tool, and the 16 px check shows the calendar icon is unreadable, so the interface adds the label "Book" next to it.

## Common mistakes

- Generating icons without a style sheet and mixing three different styles.
- Shipping the generator's raster output as if it were a production-ready SVG.
- Reviewing icons on a large canvas and not at real size.
- Ignoring optical adjustment and trusting only the measurements.
- Assuming a free plan allows commercial use: under Recraft's terms, it doesn't.
- Asking a model to imitate a trademarked icon set without checking its license.
- Using ambiguous icons without a label.

## When should you NOT use it?

When the set defines a brand people recognize everywhere, when an icon system already exists with maintenance rules, or when the meaning must be validated with users. In those cases an icon designer working in the design system's tools is the stronger option, and AI can only help explore.

There is also a legal reason. In its January 2025 report on copyright and AI, the US Copyright Office concludes that purely AI-generated material is not protected, that prompts alone don't give enough control over the output, and that a person's creative selection, arrangement and modifications are protected. It is the position of a single jurisdiction, but it suggests a brand set generated without human intervention may end up unprotected. For your own case, ask a lawyer.

## Sources

- [Nielsen Norman Group, Icon Usability (Aurora Harley, 2014)](https://www.nngroup.com/articles/icon-usability/)
- [MagicShot, AI Icon Generator: Build a Consistent Icon Set in Minutes](https://www.magicshot.ai/blog/ai-icon-generator-build-a-consistent-icon-set-in-minutes)
- [Adobe, Text to Vector Graphic in Illustrator](https://www.adobe.com/products/illustrator/text-to-vector-graphic.html)
- [Recraft, API documentation](https://www.recraft.ai/docs)
- [Recraft, terms of service](https://www.recraft.ai/terms)
- [Google Fonts, Material Symbols](https://developers.google.com/fonts/docs/material_symbols)
- [Lucide, license](https://lucide.dev/license)
- [U.S. Copyright Office, Copyright and Artificial Intelligence](https://www.copyright.gov/ai/)


---

Source: https://www.fernandoux.com/en/wiki/ai/ai-iconography/
