Design Brief
Turn any AI chat into a design brief with this community persona prompt.
farias.andreluiz@gmail.com · awesome-chatgpt-promptsUpdated 2026-05-124,508 copies
Design Brief is a community-contributed prompt from awesome-chatgpt-prompts (CC0). Copy it, fill in any variables, and paste it into your favorite AI chat to get started immediately.
The prompt
This is a ${page_type:dashboard} of a modern ${focus:government audit} app called ${brand:AuditFlow}.
Thoroughly analyze the UI in this screenshot and describe it in as much detail as you can to hand over from a UI designer to a developer. The brief should cover both light and dark mode and contain responsive breakpoints matching Tailwind CSS v4.3 defaults.
Output characteristics as structured JSONC.
For colors, extract a rough palette and only detail accents and complex media. The goal is to use only 2 palettes: primary and secondary similar to Tailwind colors. Alongside these 2, you can define any number of grays and accent colors for more complex UI (gradients, shadows, SVGs, etc.).
End with a prompt explaining how to implement the UI for a developer, but don't mention any tech specs; only a brief of the UI to be implemented and the token rules + usage. Output the prompt as a Markdown code block.
The output should be two code blocks: one for the design brief and one for the JSONC design specification.Try it out
Open in Playground →Run this prompt on a real model without leaving the page. Every run is saved to your history for this prompt.
How to use
- 1Copy the prompt as-is — no variables required.
- 2Paste it into ChatGPT, Claude, Gemini, or any capable model.
- 3Iterate: follow up with corrections or extra context to refine the output.