Build Your AI Website Prompt

Describe your dream website step by step. Get a detailed, ready-to-use prompt for any AI tool.


What type of website?

Step 1 of 7

Choose the category that best matches your project.

Services & Business
🏢
Business
Corporate, agency, consulting
🍴
Restaurant
Cafe, bakery, food business
🏠
Real Estate
Property, listings, agency
🌿
Health / Wellness
Spa, fitness, medical
Law / Legal
Attorney, law firm, legal
💪
Gym / Fitness
Training, sports, wellness
Creative & Personal
🎨
Portfolio
Personal, creative showcase
📷
Photography
Gallery, visual portfolio
📝
Blog / Magazine
Content, news, articles
🎵
Music / Band
Artist, band, music studio
💒
Wedding
Celebration, invitation, planner
🛫
Travel
Tourism, booking, guides
Commerce & Community
🚀
SaaS / Landing
Product, startup, app landing
🛒
E-Commerce
Online store, product catalog
🎓
Education
Course, school, e-learning
🎪
Event
Conference, meetup, festival
💚
Non-Profit
Charity, NGO, cause
Church
Religious, community, ministry
Please select a website type to continue.

Pick a design style

Step 2 of 7

Select the overall aesthetic direction for your website.

Clean & Structured
Minimalist
Clean, whitespace, elegant
👔
Corporate
Trust, structure, professional
🇨🇭
Swiss
Grid-heavy, Helvetica, typographic
Flat / Material
Clean surfaces, subtle elevation
Nordic
Muted tones, functional, airy
🍱
Bento Grid
Apple-style mixed card sizes
Japanese / Zen
Wabi-sabi, muted, asymmetric
Neomorphism
Soft UI, embossed, subtle depth
Luxury
Premium, serif fonts, gold accents
Bold & Dynamic
🌑
Dark Modern
Dark theme, sleek, tech-forward
🌌
Cyberpunk
Neon glow, futuristic, high contrast
🧱
Brutalist
Raw, bold, anti-design
🎆
Maximalist
Bold patterns, layered, vibrant
🎨
Gradient
Colorful gradients, abstract art
🌈
Playful
Fun, vibrant, rounded shapes
📰
Editorial
Bold headlines, magazine layout
🌍
Parallax
Scroll-driven, layered, immersive
💻
Terminal
Monospace, code aesthetic, hacker
Textured & Themed
💎
Glassmorphism
Frosted glass, blur, translucent
🔮
Glasspunk
Vivid glass layers, colorful depth
📓
Skeuomorphic
Realistic textures, physical look
💠
Art Deco
Geometric, gold lines, 1920s elegance
🌻
Bohemian
Handwritten fonts, warm, eclectic
🏭
Industrial
Brick, steel, concrete feel
Vintage Rustic
Chalkboard, hand-drawn, artisan
🌿
Organic
Earthy, warm, nature-inspired
📼
Retro
Vintage, nostalgic, classic vibes

Choose a color scheme

Step 3 of 7

Pick a curated palette or enter your own brand colors below.

Light & Clean
Classic Blue
Suggested
Forest Green
Suggested
Ocean Blue
Suggested
Modern Teal
Suggested
Monochrome
Suggested
Soft Blush
Suggested
Lavender
Suggested
Nordic Slate
Suggested
Silver Lining
Suggested
Warm & Earthy
Sunset Rose
Suggested
Charcoal & Gold
Suggested
Warm Neutral
Suggested
Greenery Moss
Suggested
Pastel Dream
Suggested
Ice Cream
Suggested
Honey Orange
Suggested
Summer Fields
Suggested
Mauve Serenity
Suggested
Dark & Bold
Warm Amber
Suggested
Electric Orange
Suggested
Urban Dusk
Suggested
Midnight
Suggested
Graphite & Copper
Suggested
Terminal Green
Suggested
Deep Ocean
Suggested
Ink & Paper
Suggested
Neon Night
Suggested

Layout preferences

Step 4 of 7

Choose how key sections of your website should be structured.

Top Navbar
Classic fixed header
Sidebar
Vertical left-side nav
Centered
Logo center, links below
Hamburger
Hidden full-screen menu
Full Image
Background image, centered text
Split Layout
Text left, image right
Gradient
Animated gradient background
Video BG
Looping video background
Text Only
Bold typography, minimal
Image Slider
Rotating slides carousel
Particle / 3D
Interactive animated canvas
Card Grid
Grid of cards for content
Alternating
Zigzag left-right sections
Masonry
Pinterest-style staggered grid
Timeline
Scrolling story or history
Minimal
One-line copyright & links
Multi-Column
Links, about, contact columns
Fat Footer
Newsletter, map, rich content
Sticky Bar
Fixed bottom bar with CTA
Compact
Dense, tight, more content visible
Normal
Balanced, standard padding
Spacious
Generous whitespace, airy
Fade In
Elements fade in on scroll
Slide Up
Staggered slide-up reveals
Parallax Layers
Depth-based scroll effects
None
Static, no animation

Content details

Step 5 of 7

Tell us about your website's content and tone. All fields are optional.

Professional
Trustworthy, confident
Casual & Friendly
Approachable, relaxed
Bold & Energetic
Dynamic, high-energy
Elegant
Sophisticated, refined
Playful & Fun
Lighthearted, cheerful
Minimal & Direct
Clean, to the point
Warm & Welcoming
Cozy, inviting
Tech & Innovative
Forward-thinking, modern
Single Page
One-page scrolling site
Multi-page (3-5)
Small site, a few pages
Multi-page (5-10)
Larger site, many pages

Features & tech stack

Step 6 of 7

Select interactive features and choose your technology preferences.

Mobile Menu
Dark/Light Toggle
Smooth Scroll
Scroll Animations
Contact Form
Carousel / Slider
Pricing Table
FAQ Accordion
Back to Top
Parallax Effect
Stats Counter
Image Lightbox
Newsletter Signup
Social Links
Google Maps
Preloader
Sticky CTA
Custom Cursor
🌐
HTML / CSS / JS
Pure vanilla, no frameworks
💨
Tailwind CSS
Utility-first CSS framework
🅱
Bootstrap 5
Popular component framework
React
Component-based with JSX
Code Comments
Semantic HTML5
CSS Variables
SEO Meta Tags
Google Fonts
Icon Library
Accessibility
Single File

Your AI prompt is ready!

Step 7 of 7

Copy this prompt and paste it into ChatGPT, Claude, or any AI tool to generate your website.

📋 Generated Prompt
✏ Click the text above to edit your prompt before copying.
Prompt Detail Score
0%
Prompt copied to clipboard!