I ran the exact same web dev prompt through three AI models — Claude, GPT-4o, and Gemini — and asked each to build a complete landing page from a single index.html file. Same prompt, zero edits, three very different results.
The Test
The prompt asked for a full landing page for a fictional tuition company, requiring:
- Sticky nav with mobile hamburger menu
- Hero section with SVG illustration + stats
- Courses grid, testimonials carousel (auto-slide + dots)
- Real-time JS form validation
- Scroll animations via Intersection Observer
- Zero frameworks — no Bootstrap, no Tailwind, no jQuery
Results
| Feature | ChatGPT | Claude | Gemini |
|---|---|---|---|
| Lines of code | 99 | 1,157 | 1,915 |
| Overall score | 52/100 | 🥇 89/100 | 🥈 84/100 |
| Typography | System default | Playfair + DM Sans | Playfair + Plus Jakarta Sans |
| Scroll animations | ❌ None | ✅ Full staggered | ✅ Full scroll reveal |
| Form validation | Alert only | ✅ Real-time | ✅ Inline error fields |
| SEO meta tags | Basic | Good | ✅ Full OG setup |
| Prompt coverage | ~30% | ~85% | ~95% |
🥇 Claude — Best Overall (89/100)
Strongest aesthetic output: elegant hero with a gradient dot pattern, clean Playfair Display + DM Sans pairing, staggered scroll animations, and a testimonials carousel with real-time validation (including an Indian phone number regex). Minor miss: the hero stats row was thinner than the prompt asked for.
🥈 Gemini — Most Complete (84/100)
Longest and most literal output — nearly full prompt coverage, complete Open Graph/SEO metadata, and touch-swipe support on the carousel. Trade-off: verbose code that's harder to edit, and less visual cohesion than Claude's output.
🥉 ChatGPT — Basic Prototype (52/100)
Just 99 lines — missed animations, the carousel, form validation, and custom fonts entirely. Looks like it hit an output length limit rather than a capability gap.
Takeaway
Better prompting only pays off if the model can actually execute on long, detailed instructions. Claude wins on design polish and code cleanliness, Gemini wins on raw completeness and SEO scaffolding, ChatGPT is fine for a quick prototype but not a full build.
Full write-up with live interactive previews of each AI's actual output: read it here
Top comments (0)