40+ Best Prompts for AI Website Design 2026 (Copy Paste Ready)

Design a modern SaaS landing page for an AI analytics platform. Use a dark theme with deep navy (#0a0e27) background. Include a hero section with a bold headline, animated gradient text, a CTA button with glow effect, and a floating 3D dashboard mockup. Add sections for features (3-column grid with icons), pricing cards with glassmorphism, testimonials carousel, and a footer with newsletter signup. Use Inter font. Make it fully responsive.

Create a high-converting product launch landing page for a premium headphone brand. Clean, minimal white design with bold typography. Hero: full-width product image with parallax scroll effect. Sections: product features with split-screen layout, comparison table, video testimonial embed, countdown timer for launch date, and email capture form with micro-animation on submit. Mobile-first responsive design.

Build a startup landing page for a fintech app. Use a gradient background (purple to blue). Include an animated hero with app mockup on a phone frame, feature highlights with Lottie animations, trust badges (Y Combinator, TechCrunch logos), a three-step "How it works" section, FAQ accordion, and a sticky CTA bar at the bottom on mobile.

Design a conversion-focused landing page for an online course platform selling a web development bootcamp. Dark mode with neon green accents. Hero with student count badge, course curriculum accordion, instructor bio with credentials, student success metrics, pricing with "most popular" badge, money-back guarantee section, and FAQ.

Create an app download landing page for a fitness tracking app. Vibrant gradients (orange to pink). Split hero with phone mockup showing the app UI. Features section with animated stat counters, before/after transformation gallery, app store download buttons with QR code, user review cards, and a CTA section with motivational copy.

Design a dark, cinematic portfolio website for a 3D artist. Use a pure black (#000) background with subtle grid lines. Hero: large typography with the artist's name using gradient text, a spinning 3D object (CSS only). Projects section with masonry grid of rendered images that expand on hover. About section with split layout. Contact form with glassmorphism panel. Smooth page transitions.

Create a minimal developer portfolio with a terminal/command-line aesthetic. Monospace font (JetBrains Mono), green-on-black color scheme. Hero section that types out the developer's introduction like a terminal. Projects displayed as "git log" entries. Skills as a dependency tree. Contact form styled as a CLI input. Easter egg: Konami code activates a retro mode.

Build a photography portfolio website with an editorial, magazine-like aesthetic. Off-white (#f5f5f0) background. Hero with a full-bleed featured image. Gallery using a horizontal scroll container with parallax depth effect. Each project page shows the photo story with large images and minimal text. Light/dark mode toggle. Responsive masonry layout for mobile.

Design a UX/UI designer portfolio with case study pages. Clean white background with accent color (#6366f1). Hero with name, role, and a subtle animated background. Case studies displayed as cards with cover images, brief description, and "Read Case Study" CTA. Each case study page includes: problem statement, research findings, wireframes, final mockups, and metrics/results. Smooth scroll-triggered animations.

Create a freelance creative director portfolio. Bold, oversized typography. Black and white color scheme with one accent color (electric blue). Horizontal scroll hero with project previews. Hover effects reveal project details. "Selected Works" section with video thumbnails. Animated cursor with custom design. Loading screen with logo animation. Full-screen menu overlay on mobile.

Design a luxury fashion e-commerce website. Minimal, editorial style with serif headlines (Playfair Display) and sans-serif body (Inter). Hero with full-screen video background showing models. Product grid with hover zoom effect. Quick-view modal with size selector, color swatches, and add-to-cart animation. Wishlist functionality. Sticky cart icon with item count badge.

Build a tech gadget e-commerce store with a dark, futuristic design. Products displayed in 3D-style cards with perspective tilt on hover. Category filters with animated chips. Product page with 360° image viewer, specification comparison table, customer reviews with star ratings, and related products carousel. Checkout flow with progress stepper.

Create an organic food delivery e-commerce website. Warm, earthy color palette (greens, browns, cream). Hero with illustrated food graphics. Product cards with "Add to Cart" micro-animation. Recipe section linking to ingredients you can buy. Subscription box builder with drag-and-drop items. Nutritional info tooltips on products. Farm-to-table story section.

Design a digital products marketplace for selling templates, UI kits, and fonts. Dark theme (#0d0d0d). Product cards with live preview thumbnails. Search with instant results dropdown. Category sidebar with expandable filters. Product detail page with live demo button, file format badges, license selector, and "Buy Now" vs "Add to Cart" CTAs. Creator profile pages with earnings dashboard.

Build a sneaker e-commerce website with streetwear culture aesthetic. Bold colors, graffiti-inspired accents. Hero with rotating 3D sneaker model (CSS 3D transforms). "Drop" countdown timers for limited releases. Size guide modal with foot measurement tool. Instagram feed integration showing customer photos. Loyalty points system displayed in user dashboard.

Design an analytics dashboard for a marketing SaaS platform. Dark theme (#0f0f12). Left sidebar with collapsible navigation icons. Top bar with search, notifications bell, and user avatar dropdown. Main content: KPI cards (revenue, users, conversion rate) with sparkline charts, a large area chart for traffic trends, bar chart for channel comparison, and a data table with sorting/filtering. Use glassmorphism card style.

Create a project management dashboard similar to Linear or Notion. Clean UI, dark mode with subtle blue accents (#3b82f6). Features: Kanban board with drag-and-drop columns (To Do, In Progress, Review, Done), task cards showing assignee avatar, priority badge, and due date. Sidebar with workspace switcher, project list. Command palette (Cmd+K) with search. Activity timeline panel.

Build a CRM dashboard for a sales team. White background with clean design. Left nav with Sales, Contacts, Deals, Reports sections. Main view: deal pipeline as horizontal funnel visualization, recent activities feed, top performers leaderboard, revenue forecast chart. Contact detail page with interaction timeline, email integration, and deal association. Data import modal.

Design a real-time monitoring dashboard for DevOps/infrastructure. Dark theme with matrix-green accents. Live server status grid with green/red indicators. CPU, memory, network usage gauges. Log stream viewer with syntax highlighting and severity filters. Alert configuration panel. Incident timeline. Deployment history with rollback buttons. Uptime percentage badges per service.

Create a financial dashboard for personal budgeting. Modern, clean design with rounded elements. Expense breakdown donut chart, spending trends line graph, budget vs actual bar comparison, upcoming bills list with due dates, savings goals with progress bars, linked bank accounts with sync status, and a transaction list with category tags and search.

Design a creative digital agency website. Dark theme (#050505) with a vibrant accent gradient (cyan to purple to pink). Hero with bold rotating text showcasing services ("We Design" → "We Build" → "We Scale"). Case study grid with hover image reveals. Team section with playful hover interactions (photos change to casual shots). Client logo carousel. Contact page with scheduling integration.

Create a consulting firm website. Professional, trustworthy aesthetic. Navy blue (#1a237e) and white color scheme. Hero with abstract geometric background. Services displayed in a tabbed interface. Case studies with ROI metrics. Leadership team with LinkedIn links. Thought leadership blog section. "Book a Consultation" floating CTA. Trust indicators: certifications, years in business, client count.

Build a branding agency website with avant-garde design. Black background with bright yellow (#FFD600) accents. Asymmetric layouts. Case studies presented as full-screen scrolling stories. Custom cursor that changes shape on different elements. Menu is a full-screen overlay with large typography. Loading animation with the agency logo. Horizontal scroll section for brand transformations.

Design a web development agency website with a futuristic, code-inspired theme. Dark background with code syntax highlighting colors. Hero shows a terminal-style animation typing out "Building the Future". Services section uses a circuit board layout connecting different offerings. Portfolio displayed as browser window mockups. Tech stack section with animated logos. Contact form with real-time validation.

Create a performance marketing agency website. Data-driven design with charts and metrics visible in the hero. Color: black with electric green (#00FF88). ROI calculator interactive section. Case study cards showing before/after metrics. Client testimonial video section. Services explained with animated infographics. Blog section with filterable categories. Real-time campaign stats ticker.

Design a tech blog with a clean, Medium-inspired reading experience. White background, wide content column (700px max), serif font for body (Georgia or Lora), sans-serif for headings. Featured article hero with large image. Article cards in a two-column grid. Estimated reading time badges. Author bio section with social links. Code blocks with syntax highlighting. Related articles section at the bottom.

Create a dark-themed developer blog with code-centric design. Background: #0d1117 (GitHub dark). Monospace font for code, Inter for content. Syntax-highlighted code blocks with copy buttons. Table of contents sidebar that tracks scroll position. Tag-based filtering. Series/collection pages for multi-part tutorials. Newsletter signup with "Join X developers" social proof. Dark/light mode toggle.

Build a lifestyle blog with magazine-style layout. Elegant, airy design with lots of whitespace. Full-width featured article with overlay text. Category-based sections (Travel, Food, Wellness) each with distinct accent color. Pinterest-style masonry grid for posts. Instagram-style image galleries. Newsletter popup with exit intent trigger. Social sharing floating sidebar.

Design an AI/startup newsletter landing page and blog. Futuristic dark design. Hero: animated particle background with bold headline. Past issues displayed as cards with key highlights. Subscriber count with real-time ticker. Archive with search and category filter. Individual issue pages with rich formatting, embedded tweets, and charts. "Share this issue" buttons. Referral leaderboard section.

Create a documentation site for an open-source project. Clean, professional layout. Left sidebar with hierarchical navigation (collapsible sections). Main content area with good typography, code examples with copy-paste buttons, interactive API endpoint explorer, version switcher dropdown. Search with keyboard shortcut (Cmd+K). Breadcrumbs. "Edit this page on GitHub" link. Light/dark mode.

Design a mobile-first restaurant website. Warm, appetizing color palette. Sticky header with logo and "Order Now" button. Swipeable menu categories (Appetizers, Main Course, Desserts). Each menu item shows photo, name, price, and "Add" button. Cart drawer slides in from right. Location section with embedded map. Hours displayed with open/closed status indicator. Click-to-call button.

Create a mobile-first event/conference website. Bold, energetic design. Countdown timer hero with event date. Speaker cards in a horizontal scroll. Schedule with day-based tab switcher. Ticket tiers with "Early Bird" badge. Venue section with transport directions. Sponsors logo grid. FAQ accordion. Social media wall pulling from event hashtag. "Add to Calendar" download button.

Build a mobile-first real estate listing website. Clean design with blue accents. Search bar with location autocomplete, price range slider, and property type filter. Listing cards with image carousel (swipe), price, bed/bath count, and save button. Map view toggle showing pins. Property detail page with full gallery, virtual tour button, mortgage calculator, agent contact card, and neighborhood info.

Design a mobile-first job board website. Modern, clean interface. Search with job title, location, and remote toggle. Job cards showing company logo, role, salary range, tags (Remote, Full-time), and posted date. Filters sidebar (mobile: bottom sheet). Job detail page with company info, requirements, benefits, and one-click apply. Saved jobs section. Email alert subscription.

Create a mobile-first gym/fitness studio website. Dark, bold design with red accents. Hero with background video of workouts. Class schedule as a weekly calendar grid. Trainer profiles with specialization tags. Membership plans comparison with "Most Popular" badge. Trial class booking form. Progress tracker mockup. Instagram feed of gym life. Bottom navigation bar on mobile (Home, Classes, Book, Profile).

Design a multi-page website for an architecture firm. Ultra-minimal, Swiss design inspired. Large imagery, strict grid system, Helvetica-like typography. Hero: cinematic project showcase with Ken Burns effect. Projects page with category filter (Residential, Commercial, Public). Each project has a dedicated page with an image gallery, specifications table, location map, and related projects. Awards section.

Create a music artist/band website with an immersive, visual experience. Dark theme with dynamic color that changes based on album art. Hero: full-screen album artwork with floating tracklist. Music player integrated into the bottom bar (Spotify-like). Tour dates section with map and "Get Tickets" buttons. Merch store section. Photo/video gallery. Social links with follower counts. Newsletter with free download incentive.

Design a Web3/crypto project landing page. Futuristic dark theme with neon gradients. Animated particle mesh background. Hero with token price ticker, "Connect Wallet" button. Tokenomics section with interactive pie chart. Roadmap as a vertical timeline with milestone markers. Team section with ENS names. Community section with Discord/Twitter stats. Token contract address with copy button. Audit badges.

Build an AI product demo website (like Jasper or Copy.ai). Dark theme with purple gradients. Hero with live demo input where users type a prompt and see AI-generated output animate in. Feature comparison table with competitor checkmarks. Integration logos section. Pricing with annual/monthly toggle and enterprise "Contact Sales" option. Video testimonials carousel. API documentation teaser section.

Create a design system documentation website. Clean, professional interface. Left sidebar with component categories (Buttons, Cards, Forms, Typography, Colors). Main area shows each component with: live preview, code snippet with copy button, props/API table, usage guidelines, do's and don'ts examples. Theme customizer panel. Color palette generator. Typography scale preview. Spacing and sizing reference.

Design an interactive storytelling/scroll-driven website for a climate change awareness campaign. Full-screen sections with parallax scroll animations. Data visualizations (temperature rise line chart, ice loss animation, carbon emissions bar race). Each scroll section reveals new content with fade and slide transitions. "Take Action" CTA with petition form. Share statistics as social media cards.

Build a premium resume/CV website for a senior product designer. Minimalist, elegant design. Off-white background (#fafafa) with subtle warm accents. Sections: Professional Summary, Experience Timeline (vertical with expandable details), Skills radar chart, Selected Projects with case study links, Education, Certifications, Publications. Download PDF button. Availability status indicator. Contact form with Calendly integration.