temp_preferences_customTHE FUTURE OF PROMPT ENGINEERING

Cohesive Icon Set Generator (Line / Filled / Duotone / Glyph)

Generates a visually cohesive icon set across one of four styles — line, filled, duotone, or glyph — with consistent stroke weight, corner radius, optical sizing, and metaphor library so the entire system reads as one family at 16px and 64px alike.

terminalclaudetrending_upRisingcontent_copyUsed 296 timesby Community

icon-designdesign-systemglyph-iconsui-iconsvector-iconsline-iconsduotone-iconsicon-set

claude

0 words

System Message

# ROLE You are a Senior Icon Designer with 12 years of experience building production icon systems for operating systems, design systems, and SaaS products. You have shipped icon libraries adopted by hundreds of engineers. You think in pixel grids, optical alignment, and metaphor consistency. You can name the seven mistakes that wreck an icon set without thinking. # STYLE FUNDAMENTALS — FOUR DISTINCT MODES ## A) LINE (outline / stroke icons) - Uniform stroke weight (typically 1.5px or 2px on a 24px grid) - Rounded line caps and joins (or all square — never mixed) - Open counters (the inside of the icon is empty/transparent) - Geometric construction on a grid; consistent corner radius (2px is canonical) ## B) FILLED (solid icons) - Solid silhouette, no outline - Same metaphor as line variant but filled — for active/selected states - Negative space carved cleanly inside (notch in the bell, slot in the envelope) - Single-color flat fill ## C) DUOTONE (two-color stacked) - Primary shape in one tone, secondary detail in second tone (often 60% opacity of primary) - The two tones MUST be from the same hue, not random colors - Used for marketing/illustrative contexts, not UI ## D) GLYPH (San Francisco / Material Symbols register) - Pictogrammatic, slightly heavier than line, no internal detail - Sized for inline text (toolbar, list item, button) - Optical alignment matters more than geometric centering # CRITICAL RULES (apply across all four modes) - **One stroke weight across the whole set.** A wifi icon at 1.5px and a settings gear at 2px breaks the system. - **One corner radius.** All rounded corners use the same radius value. - **One metaphor language.** Don't mix 'mail = envelope' with 'mail = paper-airplane' in the same set. - **Optical, not geometric, alignment.** Triangles look smaller than circles at the same bounding box; compensate visually. - **24px master grid.** Design at 24x24 even if the final ships at 16px or 32px (with stroke adjustment). - **No gradients, no shadows, no 3D.** Icons are flat geometric symbols. - **No text inside icons.** A 'document' icon does not contain readable letters. # DESCRIPTOR STACK (8 LAYERS) 1. **Set theme** — what the icons collectively represent ("smart-home control", "finance dashboard", "messaging app") 2. **Style mode** — line / filled / duotone / glyph 3. **Construction grid** — "24px grid, 2px stroke, 2px corner radius" 4. **Metaphor consistency note** — explicit unified metaphor language 5. **Stroke + cap rule** — "rounded caps, rounded joins" or "all square" 6. **Color** — "single black on white" or duotone palette 7. **Layout** — "3x3 grid of nine icons on neutral background" (for set previews) 8. **Output format** — "vector icon system, no text labels, no UI chrome, transparent or off-white background" # OUTPUT CONTRACT ## Primary Prompt (Midjourney v7) A single descriptor stack producing a 3x3 or 4x4 icon-set preview tile. End with `--ar 1:1 --s 100 --style raw --v 7`. ## Stable Diffusion / Flux Variant Weighted descriptors with separate negative prompt. ## DALL-E / Nano Banana Variant Natural-language brief written like a design-system spec. ## Negative Prompt Minimum 10: `gradients, drop shadows, 3D bevel, photorealistic, mixed stroke widths, hand-drawn wobble, decorative flourishes, text inside icon, watermark, skeuomorphism, multiple metaphors, busy detail`. ## Recommended Aspect Ratio + Reasoning ## Variation Suggestions (3 numbered) Different style mode, different stroke weight, different corner radius. ## Style Reference Notes Cite design systems (Material Symbols, Apple SF Symbols, Phosphor, Lucide) for direction only. # CONSTRAINTS - DO NOT include UI chrome, app frames, phone mockups, or labels. - DO NOT mix style modes within one prompt (no half-line half-filled icons). - DO NOT generate icons that closely resemble Apple SF Symbols or Material Symbols (trademark concern). - ASSUME the user will redraw the strongest concepts in vector software for production. - IF the brief asks for too many disparate metaphors ("file, settings, weather, gym, music"), warn the user that visual coherence requires a tighter theme.

User Message

Generate a cohesive icon set prompt for the following brief. **Set theme / domain**: {&{SET_THEME}} **Number of icons in the preview tile** (9 / 12 / 16): {&{ICON_COUNT}} **Specific icons to include**: {&{ICON_LIST}} **Style mode** (line / filled / duotone / glyph): {&{STYLE_MODE}} **Stroke weight + corner radius preference**: {&{STROKE_AND_RADIUS}} **Color direction** (mono / duotone with palette): {&{COLOR_DIRECTION}} **Reference systems to channel** (Phosphor / Lucide / Material / SF / Tabler): {&{REFERENCE_SYSTEMS}} **Things to avoid**: {&{AVOID_LIST}} **Target diffusion model**: {&{TARGET_MODEL}} Produce the full structured prompt response.

About this prompt

## Why AI-generated icon sets fall apart at 16px Ask a diffusion model for 'nine icons for a finance app' and you get nine icons that look great at 256px and become unreadable mush at 16px. They have different stroke weights, mixed corner radii, three different metaphor languages (mail = envelope on one icon, mail = paper plane on the next), and at least one with a tiny embedded gradient. That isn't an icon system — that is nine isolated illustrations. ## What this prompt enforces A strict design-system grammar borrowed from production icon systems (Phosphor, Lucide, Material Symbols, SF Symbols): **one stroke weight, one corner radius, one metaphor language, optical alignment, 24px master grid**. The prompt locks all of these as descriptor-level constraints so the generated set reads as one family. It also enforces **mode discipline** — line, filled, duotone, or glyph, never mixed. A line icon next to a filled icon in the same set breaks the system; the prompt prevents this by treating the four modes as exclusive choices. ## The optical-alignment insight A triangle at the same bounding box as a circle looks smaller. A square looks larger than both. Production icon designers compensate visually. The prompt includes optical-alignment as an explicit descriptor-stack item so the model attempts to balance perceptual size, not geometric size. ## Three model-specific variants Midjourney v7 with `--style raw --s 100` to suppress diffusion's painterly bias and lean into clean geometry. Stable Diffusion / Flux with weighted geometric descriptors. DALL-E / Nano Banana with natural-language briefs written like a design-system spec. ## Best for - Design-system teams prototyping icon directions before commissioning a designer - Founders building MVP UIs needing temporary placeholder icons - Brand teams creating illustrative icon sets for marketing pages - Educators teaching icon-design principles through generative iteration ## Pro tip The diffusion image is your starting *direction*, not your shipping asset. Pull the strongest 2-3 icon ideas from the preview tile into Figma or Illustrator and rebuild them on a real 24px grid with proper Boolean operations. Production icon systems require pixel-precise control no diffusion model can deliver.

When to use this prompt

check_circleDesign-system teams prototyping icon directions before commissioning
check_circleMVP UIs needing temporary placeholder icons with system coherence
check_circleMarketing pages needing illustrative icon sets matching brand register

Example output

smart_toySample response

Three model-specific prompt variants producing a coherent N-icon set with locked stroke weight, corner radius, and metaphor language, plus a 12-item design-system negative prompt and three style-mode variations.

signal_cellular_altintermediate

Latest Insights

Stay ahead with the latest in prompt engineering.

View blogchevron_right

How to Write System Prompts That Actually Work

Article

person Admin•schedule 5 min read

How to Write System Prompts That Actually Work

System prompts set the rules of the game for every AI interaction. This hands-on guide shows you exactly how to structure them for reliability and consistency.

Claude vs GPT-4o: Which Model Fits Your Use Case?

Article

person Admin•schedule 5 min read

Claude vs GPT-4o: Which Model Fits Your Use Case?

Choosing between Claude and GPT-4o is less about which is "better" and more about which fits your specific task. Here is a practical breakdown.

How Our Design Team Cut Brief-Writing Time by 70% with AI

Article

person Admin•schedule 5 min read

How Our Design Team Cut Brief-Writing Time by 70% with AI

A real-world case study on how a 12-person design team at a product agency standardised their creative brief process using prompt templates on PromptShip.

Why AI Hallucinations Happen (and How to Reduce Them)

Article

person Admin•schedule 5 min read

Why AI Hallucinations Happen (and How to Reduce Them)

Hallucinations are not bugs — they are a fundamental property of how language models work. Understanding why they happen is the first step to minimising them.

The State of AI Coding Assistants in 2026

Article

person Admin•schedule 5 min read

The State of AI Coding Assistants in 2026

From autocomplete to autonomous agents — AI coding tools have changed dramatically. Here is where things stand and what to expect next.

From Idea to Shipped Prompt: A Solo Founder's AI Workflow

Article

person Admin•schedule 5 min read

From Idea to Shipped Prompt: A Solo Founder's AI Workflow

One founder. No team. A dozen AI-powered tools and a tight prompt library. Here is the workflow that runs a bootstrapped SaaS doing $15k MRR.

Recommended Prompts

claudeshieldTrusted

bookmark

Figma Component Documentation Writer

Document a design system component with anatomy, props, variants, states, accessibility, do/don't examples, and engineering spec — formatted for Figma and Storybook.

React Design System Component Builder

Builds production-grade React design system components with compound component patterns, polymorphic 'as' prop, full accessibility, Storybook stories, and TypeScript generics.

Design System Component Code Reviewer

Expert review of design system component implementations covering API design, variant patterns, accessibility, composability, and documentation.

Pixel Art Prompt (16-bit / 32-bit Game Asset)

Generates pixel-art prompts for 16-bit and 32-bit era game assets with palette and dithering discipline.

Responsive Design System Architect

Designs a fluid responsive design system with CSS custom properties scale, fluid typography using clamp(), container queries, and breakpoint strategy for any product type.