icon-set-generator

Solid

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. This skill produces individual SVG files with a consistent style engine, not generic icon library lookups.

Web & Frontend 809 stars 82 forks Updated 2 weeks ago MIT

Install

View on GitHub

Quality Score: 93/100

Stars 20%
97
Recency 20%
90
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# 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...

Details

Author
jezweb
Repository
jezweb/claude-skills
Created
7 months ago
Last Updated
2 weeks ago
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Solid

svg-icon-generator

Generate svg icon generator operations. Auto-activating skill for Visual Content. Triggers on: svg icon generator, svg icon generator Part of the Visual Content skill category. Use when working with svg icon generator functionality. Trigger with phrases like "svg icon generator", "svg generator", "svg".

2,266 Updated today
jeremylongshore
AI & Automation Solid

iconsax-library

Extensive icon library and AI-driven icon generation skill for premium UI/UX design.

39,227 Updated today
sickn33
Web & Frontend Listed

icon-generator

Generate web UI/UX icon assets (favicon.ico, apple-touch-icon, PWA icons incl. maskable) and optionally Unreal Engine packaging icons (Windows .ico, macOS .iconset/.icns, Linux .png) from a single source SVG/PNG; use when you need correct multi-size icon files, safe-area guidance, manifests/head tags, or automation.

1 Updated today
KhaiEr720
Web & Frontend Listed

icon-design

Select semantically appropriate icons for websites using Lucide, Heroicons, or Phosphor. Covers concept-to-icon mapping, React/HTML templates, and tree-shaking patterns. Use when: building feature sections, service grids, contact info, navigation, or any UI needing icons. Prevents emoji usage, ensures consistency.

0 Updated 3 days ago
citedy
Web & Frontend Solid

favicon-generator

When the user wants to implement, optimize, or audit favicon and app icons. Also use when the user mentions "favicon," "app icon," "browser icon," "touch icon," "PWA icon," "favicon sizes," "apple-touch-icon," "favicon.ico," "site icon," or "tab icon." For visual system, use brand-visual-generator.

553 Updated 3 weeks ago
kostja94