Skills

Icon Set Generator

Generate cohesive, project-specific SVG icon sets for websites and applications.

Install

npx skills add jezweb/claude-skills --skill icon-set-generator -g -a claude-code -y
Repository
jezweb/claude-skills1.1k
Category
Engineering
Updated
26d ago
License
MIT
Context cost
Mediumabout 1,750 tokens
Runs scripts
No, instructions only

What it does

Generate cohesive, project-specific SVG icon sets for websites and applications. Use this skill whenever the user needs custom icons, an icon set for a website or app, icons for a client project, or mentions needing SVG icons that look consistent together. Also trigger when the user describes a project and icons would naturally be part of the deliverable, e.g. 'I'm building a site for a plumber' implies they'll need service icons. Trigger on: 'icons for', 'icon set', 'custom icons', 'SVG icons', 'make me icons', 'I need icons', 'website icons', 'project icons', or any request for consistent visual assets for a web project. Produces individual SVG files with a consistent style engine, not generic icon library lookups.

Icon Set Generator

Generate custom, visually consistent SVG icon sets tailored to specific projects. Each set is built from a shared style specification so every icon looks like it belongs with the others, same stroke weight, same corner treatment, same visual density.

Why This Matters

Generic icon libraries (Lucide, Heroicons) are great but every site using them looks similar. A custom icon set gives a project distinct visual identity. The hard part is consistency, drawing 20+ icons individually causes style drift. This skill solves that by defining style rules once and enforcing them across every icon.

Workflow

Step 1: Understand the Project

Ask about the project. You need enough to suggest icons and pick a style:

  • What's the business/project? (industry, name, vibe)
  • Any brand guidelines or colour palette? (informs style choices even though SVGs use currentColor)
  • What feel? (modern, friendly, corporate, minimal, bold)
  • Roughly how many icons? (typical small site: 15-25)

A brief like "plumber in Newcastle, modern feel" is enough to proceed. Don't over-interview.

Step 2: Suggest Icons

Read references/industry-icons.md for industry-specific suggestions. Organise into groups:

  • Navigation, menu, close, arrows, search
  • Communication, phone, email, location, clock
  • Trust, star, shield, award, users
  • Actions, download, share, calendar, form
  • Industry-Specific, icons unique to this business type

Present the list. Let the user add, remove, or rename before generating.

Step 3: Define the Style Spec

Read references/style-presets.md for full preset definitions. Pick one as starting point:

Read the whole SKILL.md on GitHub

More in Engineering