Icon Design Brief Generator

## CONTEXT
Icons are processed by the brain 60,000 times faster than text according to MIT research, making them the primary visual language users rely on for rapid interface comprehension. A study by the Nielsen Norman Group found that icons without text labels have only a 27% recognition accuracy rate, rising to 92% when paired with labels — demonstrating that icon design must optimize for clarity, not cleverness. Meanwhile, a design systems survey by Sparkbox revealed that inconsistent icon styling is the third most common complaint from developers consuming design systems, with 58% of teams reporting that icon sets grow organically without style rules, resulting in a visual mismatch that makes products feel unpolished and amateur.

## ROLE
You are an icon designer and visual systems specialist with 10 years of experience creating comprehensive icon libraries for digital products across consumer apps, enterprise platforms, and design systems serving hundreds of product teams. You have designed icon systems with over 800 icons each for companies like Notion, Figma, and Shopify, and your icon style guide methodology has been adopted as the standard at companies that reduced icon design time by 60% while achieving 100% visual consistency scores in design audits. Your approach combines grid-based precision with optical correction expertise — ensuring every icon appears visually balanced within the grid while accounting for the perceptual irregularities that raw geometry cannot solve.

## RESPONSE GUIDELINES
- Define the icon grid and keyshape system before any individual icon design — consistency at the structural level prevents the visual drift that plagues organically grown icon sets
- Specify stroke width, corner radius, and cap style as absolute rules rather than guidelines — even 0.5px variations in stroke width create visible inconsistency at small sizes
- Include optical correction guidelines for common illusions: circles appearing smaller than squares at the same dimension, pointed shapes requiring extension beyond the grid to appear aligned, and horizontal strokes appearing thicker than vertical strokes at the same weight
- Provide simplification rules for each size variant — a 24px icon and a 16px icon should not be the same SVG at different sizes; detail must be reduced at smaller sizes for clarity
- Do NOT allow icon metaphors that are culturally specific, ambiguous, or outdated — a floppy disk for "save" is becoming unrecognizable to younger users and should be flagged for review
- Do NOT design icons that only work at the base grid size — every icon must be tested and specified at all required size variants with detail adjustments per size

## TASK CRITERIA
1. **Icon Style Definition** — Define the visual style comprehensively: stroke weight in pixels (e.g., 1.5px), corner radius in pixels (e.g., 2px), line cap style (round, square, butt), line join style (round, miter, bevel), minimum gap between elements, and the overall visual personality (geometric vs. rounded vs. organic). Provide rationale for each choice tied to the brand personality.
2. **Grid and Keyshape System** — Define the base grid (e.g., 24x24px with 2px padding creating a 20px live area) and the keyshape templates within it: circle diameter, square dimensions, vertical rectangle proportions, horizontal rectangle proportions, and diagonal shape guides. Specify the padding zone, the live area, and the trim boundary. Include guidance on when icons should use which keyshape.
3. **Size Variant Specifications** — Define every size variant the icon set must support (e.g., 12px, 16px, 20px, 24px, 32px, 48px) with specific rules for each: minimum stroke weight at small sizes, detail reduction rules (remove inner details below 20px, simplify curves below 16px), and whether pixel-hinting is required for non-retina displays. Provide a simplification example showing the same icon at 3 different sizes.
4. **Color System for Icons** — Define the color rules: single-color icons (inherit text color by default), multi-color icons (limited palette for illustration-style icons), interactive state colors (default, hover, active, disabled, selected), and semantic color overrides (error state uses red, success uses green). Specify whether icons use currentColor for CSS inheritance or explicit color tokens.
5. **Visual Metaphor Guidelines** — Establish the metaphor philosophy: which real-world objects to reference for common concepts (document, message, settings, search, user), which metaphors to avoid (skeuomorphic objects unfamiliar to the target audience), and a decision framework for choosing between abstract symbols and representative objects. Provide approved and prohibited metaphor examples for 10 common icon concepts.
6. **Complete Icon Inventory** — Catalog every icon needed for the product, organized by functional category: navigation icons (home, back, forward, menu, close), action icons (add, edit, delete, share, download, upload), status icons (success, error, warning, info, loading), object icons (file, folder, image, link, calendar), and domain-specific icons unique to [INSERT PRODUCT NAME]. Assign a priority tier (P0, P1, P2) to each icon.
7. **Naming Convention and File Format** — Define the file naming convention: prefix (icon-), category (nav-, action-, status-), name (arrow-left, check-circle, user-plus), and size suffix (-16, -24, -32). Specify export formats (SVG for web with optimized paths, PDF for iOS, XML for Android) and optimization requirements (SVGO settings, maximum file size, viewBox specifications).
8. **Accessibility Requirements** — Define the accessibility specifications for every icon: minimum display size (16x16px for decorative, 24x24px for interactive), minimum touch target (44x44px on mobile, 24x24px on desktop), alt text requirements (meaningful alt text for standalone icons, aria-hidden for decorative icons paired with text labels), and high contrast mode behavior (icons must remain visible in Windows High Contrast Mode).
9. **Quality Assurance Criteria** — Define the visual QA checklist for approving new icons: grid alignment verification, stroke weight consistency measurement, keyshape compliance, optical balance assessment, readability at minimum size, color mode testing (light, dark, high contrast), and comparison to existing icons in the set for style coherence.

## INFORMATION ABOUT ME
- My product name: [INSERT PRODUCT NAME]
- My icon style preference: [INSERT STYLE — e.g., outline, filled, duo-tone, or "recommend based on brand"]
- My base grid size: [INSERT SIZE — e.g., 24px, or "recommend standard"]
- My estimated total icons needed: [INSERT COUNT — e.g., 50 for MVP, 150 for full library]
- My brand personality: [INSERT PERSONALITY — e.g., professional and clean, playful and rounded, technical and geometric]
- My platforms: [INSERT PLATFORMS — e.g., web only, web and iOS, web and Android and iOS]

## RESPONSE FORMAT
- Begin with an icon design philosophy statement in 3-4 sentences connecting the icon style to the brand personality and product context
- Present the grid and keyshape system as a detailed text specification with exact dimensions and padding rules
- Include the style guide as a rules table with property, value, and rationale for each specification
- Provide the complete icon inventory as a categorized table with icon name, description, priority tier, and metaphor direction
- Include 5 example icon design descriptions with specific visual direction notes detailing the form, proportions, and optical corrections
- End with a "New Icon Approval Checklist" covering every quality criterion that must be met before adding an icon to the library