How to Write a Framer Component Prop Spec from a UI Brief
Framer specs fail when they mint Dark and #0A84FF. The brief locked amount and currency. Leave Variants NONE.
The matching generator is the Framer Component Prop Spec from a UI Brief (No Fake UI Screenshots) (Framer Component Prop Spec From Ui Brief No Fake Ui Screenshots) prompt. Browse related cards in the PromptDig library (Browse more prompts). When a filled run survives, share the version you actually use (Share a prompt).
Quote prop names and types from the brief only
Write a Framer component prop spec from a UI brief. No fake screenshots, no invented tokens, no logos. Start by filling Inputs, not by asking the model to remember last week's run. If a field is blank, write NONE or NOT IN INPUTS and leave it blank through Generate. The card is built so the model cannot honestly invent a number, owner, URL, or command that you did not paste.
Paste these fields before you hit run:
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]
That inventory is the honesty ledger. Anything that does not appear there is forbidden in the draft. If you catch yourself adding a nice-to-have after the run, you are no longer using the card. You are ghostwriting. Put the extra fact in Inputs and run again.
Leave Dark VARIANT UNKNOWN if mode was omitted
Generate is numbered on purpose. Do not skip a step because the first paragraph looked done. The early steps exist to stop later prose from smuggling claims.
Walk the Generate list in order:
- Honesty ledger: Brief name, props, Variants, Tokens, Breakpoints, Lang, Max. Forbidden: fake screenshots, extra props, invented hex.
- Prop table: name, type, default from Brief only. Missing defaults write DEFAULT UNKNOWN.
- Variants: quote Variants or write NONE. Do not mint Dark if Brief is Light only.
- Tokens: quote Tokens or write NONE. Do not invent #0A84FF.
- Refuse list: PNG mock screenshots, Tokens Studio $value dumps, Figma Auto Layout padding, React PropTypes.
- Breakpoints: quote Breakpoints or write NONE.
- Never: do not add onClick if Brief omitted events. Do not invent a logo slot.
- Compliance pass: quote Banned and Never hits. Cut them. Count props vs Max. Format as Format.
If a step asks for a version lock, quote the version from Inputs in the output. If a step asks for a refuse list, keep the refuse list in the published artifact, not in a sidebar you delete. Reviewers should see what the model was not allowed to do.
Refuse fake screenshots and extra tokens
Most failures are the same shape: a missing field gets a confident fill. A conversion rate appears. A Gradle task appears. A flash point appears. A caption appears on a job that asked for slide text only. Your review is to search the draft for numbers, names, and commands, then grep Inputs. No match means cut.
Honor the constraints as hard stops, not vibes:
- 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.
When the card says not legal advice, not certification, not an exam dump, or not a caption engine, that sentence belongs at the top of the output. Deleting it to look more finished is how you inherit risk.
Count props against Max
Finish with the compliance pass the prompt already asks for. Quote the banned-word hits. Cut them. Print character counts when the job has a cap. Print word counts when the job has a budget. List gaps as gaps. Five missing facts are more useful than one smooth paragraph.
Tags on the card (framer component prop spec, ui brief lock, no fake ui screenshots) are a reminder of the job shape, not an invitation to wander into a neighboring cluster. If you need a different surface, open a different PromptDig card rather than stretching this one.
Fill the card, then run
Replace every bracket. Run on ChatGPT, Claude, or Gemini. Read the ledger first, then the artifact. If the model invents a commit, KPI, DOI, PEL, bid, or logo, discard the run. Tighten Inputs. Run again. Share the filled card that survived, not the first draft that sounded done.