AI Website Prompt Builder

Select a curated design style, customize variables to match your brand, and copy your perfect prompt. Ready to paste directly into your favorite AI assistant.

Select Style

Modern & Trendy

Classic & Professional

Creative & Artistic

Expressive & Bold

Glassmorphism Landing Page

Create a modern, single-page landing page website using a **glassmorphism** design style. The page should feel premium, airy, and futuristic.

## Design Requirements
- **Background**: A vibrant gradient background (e.g., deep purple → electric blue → teal) that spans the full viewport
- **Cards & Containers**: Use frosted-glass effect — semi-transparent backgrounds (rgba white at 10-20% opacity) with `backdrop-filter: blur(16px)` and a subtle 1px white/transparent border
- **Color Palette**: Primary gradient (#667eea → #764ba2), white text on glass elements, accent color for CTAs (#00d4ff)
- **Typography**: Clean sans-serif font (Inter), large hero heading (4-5rem), light font weights for body text
- **Layout**: Full-width hero section with centered content, 3-column feature cards below, testimonial section, and CTA footer

## Sections to Include
1. **Navigation Bar** — Transparent/glass nav with logo left, links right, glass effect on scroll
2. **Hero Section** — Large headline, subtext, two CTA buttons (primary filled, secondary outlined/glass)
3. **Features Grid** — 3 glassmorphic cards with icons, titles, and descriptions
4. **Social Proof** — Testimonial cards with glass effect, user avatars
5. **Pricing** — 3-tier pricing table with glass cards, highlighted "popular" tier
6. **Footer** — Minimal footer with links and newsletter signup

## Technical Details
- Responsive design (mobile-first)
- Smooth scroll behavior
- Subtle hover animations on cards (slight scale + glow)
- Use CSS backdrop-filter for glass effects
- Ensure text contrast meets accessibility standards on translucent backgrounds

Customize

16px
0.15

Build Websites Faster with AI

Writing prompts from scratch is time consuming. Our Prompt Builder gives you production-ready templates that tell the AI exactly what to build, down to the exact hex codes.

Curated Styles

Choose from 20 battle-tested visual styles spanning modern, classic, and creative aesthetics.

Dynamic Variables

Tweak colors, fonts, and layout parameters before copying to match your brand.

1-Click Copy

Instantly copy the optimized prompt and paste it into your favorite AI coding assistant.

Cross-AI Compatible

Works seamlessly across Claude Sonnet, ChatGPT, v0 by Vercel, Bolt.new, and Cursor.

Prompt Builder FAQ

Common questions about generating UI with our prompts.

How do I use this Prompt Builder?

Simply select a design category and style on the left, adjust the custom variables (like hex colors or typography) on the right, and click 'Copy Prompt'. Paste the result directly into an AI tool like Claude, ChatGPT, or v0 to generate your website.

Do I need coding experience to use these prompts?

No coding experience is required! These prompts are designed to instruct AI coding assistants to generate the code for you. You just need to know what visual style and colors you want.

Are these prompts free to use?

Yes, all 20 of our core website generation prompts are completely free to customize, copy, and use for both personal and commercial projects.

Which AI code generator works best?

We recommend Claude 4.6 or v0 by Vercel for the best UI generation results, but these prompts are also tested to work beautifully with ChatGPT and Cursor.

AI Website Prompt Styles

Browse every AI website prompt template available in the builder. Each style is fully customizable and free to use.

Modern & Trendy

View category

Cutting-edge design styles featuring glassmorphism, gradients, bento grids, and sleek dark modes.

Classic & Professional

View category

Timeless, polished designs for corporate sites, clean startups, and editorial layouts.

Creative & Artistic

View category

Bold, unconventional styles from brutalism to cyberpunk — designed to stand out.

Expressive & Bold

View category

Statement-making designs with bold typography, vivid colors, and organic shapes.