← My Work

Claude skill | AI workflow | Design systems

Icon Studio: A Skill That Builds Icon Libraries

I built a Claude skill that turns a style and an icon list into a consistent icon set, then used it to make three libraries in three very different styles.

Celestial Glass: soft gradient icons in brown and blue Travel Ink: hand-drawn ink line icons Restaurant Folk: flat two-tone folk icons
Role
Solo
Timeline
4 days, Oct 2026
Tools
Claude, Node, Figma, GitHub
Output
282 icons, 3 libraries

“By the tenth icon, the family no longer looks like one person drew it.”

The short version

01 · Problem

Designers need icons that match.
Almost nothing on offer does.

A designer pulls icons from many places: packs, plugins, stock sites, one-off downloads. Put together, they never match: different strokes, different detail, different sizes. Only a few open-source libraries get this right, and they rarely fit the style of your own product.

And AI doesn't fix it

Ask an AI for “icons in this style” and it hallucinates: every icon invents its own stroke, detail and size. By the tenth icon, the family no longer looks like one person drew it. Better prompts don't fix this. Consistency has to be built into the process.

02 · Solution

Make the rules the product.

icon-studio is a Claude skill that writes every style decision into one locked rules file and checks each icon against it before it ships, so the AI can't improvise its way off-style.

The critical rule

Anchors first.

Four of the hardest icons are drawn and approved before the rules lock.

  1. InputStyle + icon list
  2. Step 1Draw the 4 anchors
  3. Gate ACheck anchors against the references
  4. Step 2Rules lock
  5. Step 3Draw in batches
  6. Step 4Lint + contact sheets
  7. Gate BCheck every batch
  8. ShipSVG + PNG + preview page
Rules lock only after the anchors pass; every batch is checked before it ships.

03 · Process

Three styles to stress-test it.

I ran the skill on three very different styles. Each one pushed me to fix the system, not just the icons.

Restaurant Folk Icons preview Restaurant Folk Icons 128 iconsFlat two-tone folk The first pass came out as illustrations, with sparkles, shadows and tilt. I capped each icon at 12 shapes and two tones so it reads as an icon.
Travel Ink preview Travel Ink 90 iconsHand-drawn ink line Icons are drawn clean on the grid, then a script adds the hand-drawn wobble, so the line stays consistent and editable.
Celestial Glass preview Celestial Glass 64 iconsGradients and grain I cut the palette to brown and blue only, then added soft gradients and grain so it feels like glass and ceramic.
Open in a new tab ↗

Loading the live preview…

How I worked with the AI

  1. Fix the rule, not the icon.

    A croissant took three redraws, so I added a rule: every shade follows the object's own edges. It now applies to every set.

  2. Review renders, not code.

    I caught a burger patty that vanished from the page because of a build bug. No automated check had flagged it.

  3. Feed lessons back into the skill.

    The layering rule, the preview page and Figma “Copy all” all came from using the skill on real sets.

04 · Outcome

One skill, as many libraries as you want to build.

All three libraries here came from the same skill; only the rules file changed between them. Give it a different style and it builds a different library, as many as you need. The skill is open source, with a README, install steps and the three sets as examples.

Tried icon-studio? I'd love to hear how you found it: what worked, what didn't, and what you'd build with it. Share your feedback ↗

Up next

Photo Quality Pipeline