Page Layout Help

A suggested layout, a colour scheme, an essentials list, the most common mistakes to avoid, and free tool picks.

⬡

Recommended modelGPT-5.5 Instant

Multimodal; understands and generates visual briefs

What you need to fill in

[dashboard/form/page][purpose][who][list]

Tools used

ChatGPT

The prompt

"I need to design a [dashboard/form/page] for [purpose]. Users: [who] Key actions: [list] Please: 1. Suggest a layout 2. Recommend color scheme 3. List essential elements 4. Point out common mistakes 5. Suggest tools (free/low-cost)"

Open in ChatGPT

Sample output

**Layout (dashboard, desktop-first)** - Top: page title + global filter row (1 row) - Left rail: nav (collapsible) - Main: 3-col KPI strip → 2-col chart block → table → footer **Colour scheme** - Bg: near-black (#0E1120) - Surface: dark blue-grey (#161A2C) - Primary action: violet (#9F8CFF) - Positive / negative / neutral: cyan / rose / parchment **Common mistakes:** too many colours, busy charts, no whitespace, low contrast on labels. **Tools (free):** Figma, Penpot, Excalidraw.

Try with these tools

midjourney dall e 3 runway

ui-designlayoutbeginner1-hour

More in Creative & Design

Full App Design

User flows, wireframe descriptions, component specs, responsive considerations, a11y requirements, and a design-system recommendation.

intermediate

Design System Build

A component architecture, token structure, code examples, documentation template, and governance process — across Figma + React + Storybook.

advanced

Chart Selection Help

Chart-type picks per metric, clarity tips, a colour scheme, the labels/annotations you need, and tool suggestions.

beginner