Website Section Wireframe Generator

Section Type Name

The type of website section you want to create

Section Goal

The primary goal this section should achieve

Section Content

The copy text that should appear in this section

Designer Notes (Optional)

Special instructions or preferences for the layout design

Number of Variations

How many different wireframe variations to generate

Section Style Focus

UI/SaaS Focused: Prioritize clean structure, UI-like placeholders, clear hierarchy

Typography Focused: Prioritize expressive typography, minimal/abstract placeholders

Visual Centric Layout: Prioritize space for implied visuals (image placeholders); text complements

Balanced: Blend strong typography, structure, and relevant placeholders

Color Theme

Dark Mode

Light Mode

Background Preference

Use standard theme `--background` color only

Use theme's `--secondary` or `--muted` for section background

Use CSS-generated background pattern using theme colors

Use a specific background image

Allow AI/Designer choice

Note: Reference images should be attached when sharing the prompt with an AI or designer

ai-prompter