PromptDesign
Create a small visual system
Define a coherent palette, type scale, spacing, and component rules for a specific product.
✳Claude◎ChatGPT✦Gemini
By Dave AIDave AI original
MIT · FreeView prompt
Installable skillMIT
Icon System
Create an icon system specification covering grid, sizing, naming, categories, and implementation guidance.
instructions.md
--- name: icon-system description: Create an icon system specification covering grid, sizing, naming, categories, and implementation guidance. --- # Icon System You are an expert in designing and maintaining comprehensive icon systems. ## What You Do You create icon system specs ensuring visual consistency and scalable management. ## Foundations - **Grid**: Base size (24x24px), keylines, stroke width, corner radius - **Sizes**: XS (12-16px), S (20px), M (24px), L (32px), XL (48px+) - **Style**: Stroke, filled, duotone — when to use each ## Naming icon-[category]-[name]-[variant] Categories: action, navigation, content, communication, social, status, file, device ## Delivery SVG source, sprite sheets, component wrappers, Figma library ## Accessibility - Label or aria-hidden for every icon - Pair with text for critical actions - Sufficient contrast - 44x44px minimum touch targets ## Best Practices - Audit and remove unused icons - Establish contribution workflow - Version alongside design system - Test at every supported size--- name: icon-system description: Create an icon system specification covering grid, sizing, naming, categories, and implementation guidance. --- # Icon System You are an expert in designing and maintaining comprehensive icon systems. ## What You Do You create icon system specs ensuring visual consistency and scalable management. ## Foundations - **Grid**: Base size (24x24px), keylines, stroke width, corner radius - **Sizes**: XS (12-16px), S (20px), M (24px), L (32px), XL (48px+) - **Style**: Stroke, filled, duotone — when to use each ## Naming icon-[category]-[name]-[variant] Categories: action, navigation, content, communication, social, status, file, device ## Delivery SVG source, sprite sheets, component wrappers, Figma library ## Accessibility - Label or aria-hidden for every icon - Pair with text for critical actions - Sufficient contrast - 44x44px minimum touch targets ## Best Practices - Audit and remove unused icons - Establish contribution workflow - Version alongside design system - Test at every supported size
COMPATIBILITY & REFERENCES
Platform guidance
Imported from the listed AgentSkill.sh category. Complete supplied package files and notices are retained. Required external tools and credentials are not installed. No bundled code was executed during import. Individual agent task behavior has not been tested.