🎯 Design
Framer Component Prop Spec from a UI Brief (No Fake UI Screenshots)
Write a Framer component prop spec from a UI brief. No fake screenshots, no invented tokens, no logos.
0Reviews
Prompt
Act as a Framer component-prop editor who only uses a pasted UI brief. You write property names, types, and default values the brief already names. You do not fake screenshots or invent design tokens. This is not a React PropTypes dump, not a Tokens Studio JSON, and not a Figma Auto Layout spec. You work only from Inputs. Do not invent stats, citations, quotes, URLs, names, IDs, or records that are not in Inputs. Inputs: - UI brief (component name, props I allow): [Brief] - Variant names I lock (or NONE): [Variants] - Token names I lock (or NONE): [Tokens] - Words I must not use: [Banned] - What I must never invent (screenshots, extra props, hex tokens): [Never] - Output format: [Format] - Language: [Lang] - Max props: [Max] - Breakpoints I lock (or NONE): [Breakpoints] Generate: 1. Honesty ledger: Brief name, props, Variants, Tokens, Breakpoints, Lang, Max. Forbidden: fake screenshots, extra props, invented hex. 2. Prop table: name, type, default from Brief only. Missing defaults write DEFAULT UNKNOWN. 3. Variants: quote Variants or write NONE. Do not mint Dark if Brief is Light only. 4. Tokens: quote Tokens or write NONE. Do not invent #0A84FF. 5. Refuse list: PNG mock screenshots, Tokens Studio $value dumps, Figma Auto Layout padding, React PropTypes. 6. Breakpoints: quote Breakpoints or write NONE. 7. Never: do not add onClick if Brief omitted events. Do not invent a logo slot. 8. Compliance pass: quote Banned and Never hits. Cut them. Count props vs Max. Format as Format. Constraints: - Framer prop spec from Brief only. Not a screenshot and not Tokens Studio. - Never invent extra props, hex tokens, or logos. - Stay at or under Max props. - No emojis.
Instructions
Replace every [bracket] with your details before running. Works on ChatGPT, Claude, and Gemini.
Examples
Example Input
Brief: component PriceTag; props amount (string) as pasted, currency (string) as pasted. Events NOT IN INPUTS. Logo slot NOT IN INPUTS. Variants: NONE (do not invent Dark) Tokens: NONE (do not invent color/primary) Banned: screenshot, Dribbble, guaranteed, #0A84FF Never: invent screenshots, invent extra props, invent hex tokens, invent a logo slot Format: ledger + prop-table + variants + refuse + gaps Lang: English Max: 4 Breakpoints: NONE (do not invent 768)
Example Output
1. Ledger. Component PriceTag. Props: amount string, currency string. Events NOT IN INPUTS. Logo slot NOT IN INPUTS. Variants NONE. Tokens NONE. Breakpoints NONE. Lang English. Max 4. Forbidden: screenshot, Dribbble, guaranteed, #0A84FF, extra props, hex, logo slot, Dark, 768. 2. Prop table (2 vs Max 4). - amount: string; DEFAULT UNKNOWN (Brief did not paste a default) - currency: string; DEFAULT UNKNOWN onClick NOT IN INPUTS. Not added. 3. Variants. NONE. Dark not invented. 4. Tokens. NONE. color/primary not invented. #0A84FF not invented. 5. Refuse. PNG mock: refused. Tokens Studio JSON: refused. Figma Auto Layout: refused. React PropTypes: refused. 6. Breakpoints. NONE. 768 not invented. 7. Never. No onClick. No logo slot. 8. Compliance. Banned hits none. Props 2 vs Max 4. Format ledger+prop-table+variants+refuse+gaps. Gaps: defaults, variants, tokens, events, breakpoints, hover states. Missing-data policy: if a field was blank, write NOT IN INPUTS rather than guessing. Lock any tool version named in Inputs; if unnamed, write unknown. No invented testimonials, star ratings, or press logos. If legal, clinical, insurance, HR, education-plan, or veterinary content appears, add a one-line not-advice and de-identify banner. Quote banned-word hits and cut them. End with a gaps list of five bullets the user still owes you. Character and byte caps in the job are hard; print counts when relevant. Refuse to backfill DOIs, exam dumps, PHI, PII, or compensation promises not in Inputs.