Design brief pc 1604

Design Brief

Scroll down to copy the prompt

Text Updated 1 min read by prompts.chat · @farias.andreluiz@gmail.com Source and attribution
Advertisement

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.

Open in

The prompt is copied to your clipboard — just paste it in.

Tags

Advertisement

More like this

Related prompts

Job Interviewer AI prompt cover

Job Interviewer

Job Interviewer prompt for goals, priorities, and practical next steps. Copy it into ChatGPT, Gemini, Claude, or another AI assistant and tailor it to your task.

1
Motivational Coach AI prompt cover

Motivational Coach

Motivational Coach prompt for goals, priorities, and practical next steps. Copy it into ChatGPT, Gemini, Claude, or another AI assistant and tailor it to your task.

1
Debater AI prompt cover

Debater

Debater prompt for goals, priorities, and practical next steps. Copy it into ChatGPT, Gemini, Claude, or another AI assistant and tailor it to your task.

1