No designer on the team is no longer a death sentence for a product. In 2026 a product designer's job is roughly 40% decisions and 60% artifacts — tokens, component APIs, copy, accessibility notes, review checklists. The second part is exactly what LLMs eat for breakfast. Below are 12 prompts I actually run in real projects — each with the wording, input example, and the task it closes. Copy, paste, adapt.
1. Design system bootstrap
Task: get a first-pass token architecture before opening Figma.
You are a design systems lead. Product: [description]. Stack: [React/Tailwind]. Generate a 3-tier token structure (primitive → semantic → component). Output as a table: token name, value, tier, usage rule. Flag any token that will break dark mode.
Input example: "B2B SaaS dashboard, React + Tailwind, dark mode required." Output gives you color.blue.500 → color.action.primary → button.bg.default, plus a warning list for hard-coded values.
2. Contrast audit without plugins
Check these hex pairs against WCAG 2.2 SC 1.4.3 (AA): [list]. For each, compute contrast ratio, pass/fail for normal and large text, and suggest the nearest passing shade keeping hue.
WCAG 2.2 is a W3C Recommendation (w3.org/TR/WCAG22). LLMs handle the relative-luminance formula reliably — this saves a manual pass in a contrast checker.
3. Component API spec
Design a React component API for [component]. List props with types, defaults, and states (default/hover/focus/disabled/loading/error). Include accessibility attributes (aria-*) and a usage do/don't list.
Example: a Select with isMulti, isSearchable, aria-invalid. This is the prompt that stops frontend devs from inventing three different dropdowns.
4. UX microcopy pass
Rewrite these UI strings for [tone]. Rules: active voice, no jargon, error messages state cause + fix, max [N] chars. Output a table: screen, current, proposed, reason.
Input: "Your request could not be processed." → "We couldn't save your changes. Check your connection and try again." Cause + fix, done.
5. Empty states that don't apologize
Generate empty-state copy and layout hints for [screen]. Each state: headline (max 6 words), one-line body, primary CTA, optional illustration idea. No 'Oops!', no 'Nothing here yet.'
Empty states are the most-skipped screen in solo projects and the first thing users see on day one.
6. Figma frame → spec
I paste a description of a Figma frame. Extract: spacing scale used, type ramp, color tokens referenced, and list inconsistencies (off-grid values, one-off colors). Output a redline table.
If you use the Figma Dev Mode (available on paid seats) you can export the JSON and feed it in; otherwise describe the frame — the prompt still catches 8px-grid violations.
7. Design review checklist generator
Act as a senior product designer reviewing [screen type]. Produce a 15-item review checklist covering hierarchy, states, accessibility, edge cases (long names, zero data, RTL). Mark each item as blocker/major/minor.
Run the checklist against your own mock before showing it to anyone. Cheaper than a review meeting.
8. Responsive breakpoint plan
Given this layout [describe], propose breakpoints and what reflows at each. Flag components that need a separate mobile variant. Output as a table: breakpoint, layout change, components affected.
Example: a data table that becomes cards under 768px — the prompt names the component, you decide the pattern.
9. Icon and illustration brief
Write a brief for a consistent icon set: stroke width, corner radius, grid size, metaphor rules, 10 example icons with one-line descriptions. Style: [outline/filled].
Prevents the classic "five icon families in one app" problem when assets come from different free packs.
10. Accessibility annotation layer
For this flow [describe], list every element needing an aria-label, role, or focus order note. Output as annotations a developer can paste into the ticket.
This is the bridge between a mock and a WCAG-compliant build — and it's the part designers usually skip.
11. Handoff doc
Turn this component list [paste] into a handoff doc: states, tokens, edge cases, animation timings, open questions. Format as Markdown for a Jira ticket.
Result: a ticket a developer can start without a single "what happens on hover?" message.
12. Design debt triage
Here are known UI inconsistencies [list]. Score each by user impact (1-5) and fix cost (1-5). Sort by impact/cost ratio and suggest a 2-sprint plan.
Keeps a solo dev from rewriting the whole visual language on a Friday night.
What this actually buys you. A consistent token layer, documented component APIs, and an accessibility pass are the three things that make a product feel designed — not the mockups. Prompts don't replace taste; they remove the blank-page tax on the boring 60%. Start with prompt #1 and #2 this week, and keep the outputs in the repo next to the code — the design system lives where developers will actually read it.
Comments