What this prompt does
This prompt designs a cohesive custom icon set with a shared grid, stroke weight, and optical-alignment rules so the icons read as one family. You set [icon_count], name [product_name] and [product_description], and reference the [design_system] aesthetic to match. ChatGPT then defines the grid system, style rules, icon categories, per-icon concepts, size variants, animation specs, and export conventions.
The variables enforce consistency. [grid_size] sets the base grid and safe area, [stroke_style] and [stroke_weight] lock the line treatment, and [corner_radius] standardizes corners across every icon. [icon_categories] and [custom_category] decide which families get drawn, including your domain-specific icons. [small_size] defines where icons must stay recognizable, [size_variants] lists the export sizes with simplification notes, [animated_count] picks how many get micro-interactions, and [naming_convention] sets the file-naming scheme. Because the prompt asks for optical-alignment rules, the spec addresses the subtle reason icons of different shapes can still feel the same visual weight.
When to use it
- A product interface needs a cohesive custom icon set instead of mismatched free icons.
- You want a defined grid, stroke weight, and optical-alignment rules so icons feel like one family.
- You need domain-specific icons (git branch, terminal, deploy) alongside standard navigation and status icons.
- You want size variants specified with notes on what detail to drop at smaller sizes.
- You need micro-interaction specs for a handful of key icons.
- You want export conventions, naming, and accessibility attributes defined up front.
Example output
The output is an icon-system specification. It defines the grid based on [grid_size] with keyline shapes and optical-alignment rules, style rules covering [stroke_style], [stroke_weight], and [corner_radius], then the [icon_categories] families plus your [custom_category] icons. For each icon it gives the concept, metaphor, key elements, and how it simplifies at [small_size]. It adds [size_variants] with simplification notes, micro-interaction specs for [animated_count] icons, and export rules using your [naming_convention] with color tokens and accessibility attributes. You then draw the icons to that spec.
Pro tips
- Match
[design_system]to a real reference (Lucide, Material) so the style rules align with conventions designers already know. - Keep
[stroke_weight]consistent with your UI's text weight; a mismatch makes icons feel heavier or lighter than the type around them. - Be specific with
[custom_category]so the domain icons are genuinely useful rather than generic stand-ins. - Set
[small_size]to the smallest place icons actually appear, since that constraint drives how much detail each concept can carry. - The output is a drawing spec, not finished SVGs, so a designer or image tool still has to produce the actual icons.
- Lock the grid and stroke rules before drawing; changing them later forces you to redraw the whole set to stay consistent.
