# 20 Professional Web Design Prompts (Anti AI-Slop) — 2026 Edition

A collection of 20 ready-to-use prompts for building websites that look **professional, alive, and not AI-generated** — complete with animations, video backgrounds, distinctive typography, and natural copywriting. Based on research into 2026 web design trends, Anthropic's official `frontend-design` skill, popular community skills (UI/UX Pro Max, Taste), and performance/accessibility best practices.

## Start here

1. Read **[00-SETUP-GUIDE.md](00-SETUP-GUIDE.md)** — install the design skills (frontend-design, UI/UX Pro Max, Taste), pick your animation stack, find fonts & free background videos, learn the workflow and the anti-AI-slop checklist.
2. Pick one prompt from the `prompts/` folder that matches your project type.
3. Replace the variables in square brackets `[...]` (brand name, business details, copy language), then paste it into Claude Code.

## The 20 prompts

| # | File | Style | Best for |
|---|------|-------|----------|
| 01 | [prompts/01-editorial-magazine.md](prompts/01-editorial-magazine.md) | Editorial / Magazine | Architecture studios, creative agencies |
| 02 | [prompts/02-swiss-international.md](prompts/02-swiss-international.md) | Swiss / International Style | Design consultancies, portfolios |
| 03 | [prompts/03-dark-luxury.md](prompts/03-dark-luxury.md) | Dark Luxury + video bg | Premium real estate, watches, jewelry |
| 04 | [prompts/04-neobrutalism.md](prompts/04-neobrutalism.md) | Neobrutalism | Dev tools, indie SaaS, technical products |
| 05 | [prompts/05-glassmorphism-fintech.md](prompts/05-glassmorphism-fintech.md) | Dark Glassmorphism | Fintech, SaaS, payment platforms |
| 06 | [prompts/06-bento-grid.md](prompts/06-bento-grid.md) | Bento Grid | Productivity apps, multi-feature products |
| 07 | [prompts/07-kinetic-typography.md](prompts/07-kinetic-typography.md) | Kinetic Typography + video bg | Music festivals, events, conferences |
| 08 | [prompts/08-organic-natural.md](prompts/08-organic-natural.md) | Organic / Natural + video bg | Skincare, wellness, natural products |
| 09 | [prompts/09-y2k-retrofuturism.md](prompts/09-y2k-retrofuturism.md) | Y2K / Retro-futurism | Streetwear, music labels, creative studios |
| 10 | [prompts/10-minimal-monochrome.md](prompts/10-minimal-monochrome.md) | Minimal Monochrome | Photographers, visual portfolios |
| 11 | [prompts/11-cinematic-video-first.md](prompts/11-cinematic-video-first.md) | Cinematic video-first | Resorts, travel, hospitality |
| 12 | [prompts/12-3d-depth-tech.md](prompts/12-3d-depth-tech.md) | 3D Depth / Tech | Data/AI platforms, infrastructure |
| 13 | [prompts/13-corporate-premium.md](prompts/13-corporate-premium.md) | Corporate Premium | Consulting, law, enterprise B2B |
| 14 | [prompts/14-dopamine-maximalist.md](prompts/14-dopamine-maximalist.md) | Dopamine / Maximalist | Creative agencies, playful brands |
| 15 | [prompts/15-industrial-technical.md](prompts/15-industrial-technical.md) | Industrial / Technical | Manufacturing, robotics, logistics |
| 16 | [prompts/16-museum-gallery.md](prompts/16-museum-gallery.md) | Museum / Gallery | Cultural institutions, exhibitions, archives |
| 17 | [prompts/17-fine-dining.md](prompts/17-fine-dining.md) | Fine Dining + video bg | Restaurants, chef's tables, culinary |
| 18 | [prompts/18-handmade-collage.md](prompts/18-handmade-collage.md) | Collage / Handmade | Roasteries, indie brands, zines |
| 19 | [prompts/19-data-driven-financial.md](prompts/19-data-driven-financial.md) | Data-driven / Financial | Analytics, market research, fintech data |
| 20 | [prompts/20-personal-narrative.md](prompts/20-personal-narrative.md) | Personal Brand Narrative | Writers, speakers, founders |

Each file contains: a style description, pre-selected fonts and palette (never AI defaults), a complete copy-paste-ready prompt, and customization notes.

## Principles used across all prompts

- **One signature element** per design — one thing people remember; everything else stays disciplined.
- **Never Inter/Roboto** — every prompt uses a different, deliberate typography pairing.
- **Palettes defined in hex** — never "a modern, appealing color scheme".
- **Real copywriting** — no lorem ipsum, no "Elevate your business".
- **Motion with a reason** — orchestrated moments, not effects scattered everywhere.
- **Quality floor**: responsive, `prefers-reduced-motion`, visible keyboard focus, semantic HTML, optimized video.
