What this is: Two prompts — one high-level, one extremely specific — that get you an editorial, ultra-modern landing page in a single shot from Claude Opus 4.7. Plus the thinking behind why they work.

Made by @deepika.builds · If this helped, say hi 👋


The experiment

I was curious what the current frontier model could do if you gave it real creative latitude instead of pixel-perfect specs. Most "build me a landing page" prompts read like design documents — exact colors, exact fonts, exact spacing. That tests instruction-following. It doesn't test taste.

So I tried two prompt styles on the same brief:

  1. A high-level prompt — vibes, constraints, a few "don'ts." Let the model make every meaningful decision itself.
  2. A master prompt — every decision pre-made. Typography, palette, motion, structure, copy. Essentially a design doc in prose.

Both should produce something shippable. But they test very different things — and if you're using AI to build real product, knowing which prompt style fits which situation matters.


Prompt 1 — The high-level version

Use this when you want to see what the model's actual design sense is. Output will vary run to run. That's the point.

Build a single-file HTML landing page for an invisible or abstract 
product — a fragrance house, a literary imprint, a record label, a 
tea merchant, a philosophy journal. Pick one. The product should 
not require photography to sell; it should be sold through language, 
color, and motion.

Aesthetic direction: ultra-modern editorial. Think the intersection 
of rauno.me's motion restraint, a Comme des Garçons press site's 
editorial confidence, and the typographic maximalism of an 
independent art magazine. It should feel like it was designed by a 
two-person studio in Paris or Tokyo, not generated.

Commit to a strong point of view. Avoid:
- Generic SaaS aesthetics (centered hero, three-column features, 
  purple gradients)
- Sans-serif-everything (Inter, Roboto, Space Grotesk)
- AI-obvious choices (neon glows, glassmorphism, isometric 
  illustrations, floating 3D orbs)
- Decorative animation that doesn't serve the concept

Commit to:
- Typography as the primary visual. Use a variable serif with 
  expressive axes (optical size, weight, italic) as the hero of 
  the page. Pair with one supporting typeface for metadata.
- Color as structure, not decoration. Full-bleed saturated panels 
  earn more trust than accent colors on white.
- A conceptual spine for the page — a metaphor native to the 
  product that organizes the sections. Don't default to 
  hero/features/pricing/CTA.
- Grain, noise, or texture that keeps flat colors from looking 
  sterile.
- Motion that feels physical and considered. Pick your spots — one 
  signature scroll-linked effect matters more than ten 
  micro-interactions.

Technical:
- Vanilla HTML, CSS, JS. No build step.
- GSAP + ScrollTrigger for orchestration
- Lenis for smooth scroll
- Google Fonts only
- Responsive down to mobile

Include real editorial copy. No lorem ipsum, no "elevate your 
senses" marketing language. Write like a human with a point of view. 
Dates, prices, place names, numbered editions — the small details 
that signal a real brand.

One HTML file. Treat every decision — typeface pairing, palette, 
structural metaphor, motion choices, copy voice — as yours to make. 
The only wrong answer is playing it safe.

Why this prompt works

It specifies the problem, not the solution. "Invisible or abstract product" is a constraint that forces the model to pick something where its design instincts actually matter. A sunglasses brand would let it lean on product shots. A fragrance or literary imprint forces it to solve with typography and color alone.

The "avoid" list is doing heavy lifting. Design quality from LLMs is mostly about what they don't reach for. Banning Inter, purple gradients, glassmorphism, and isometric illustrations eliminates ~80% of generic output. The "commit to" list then gives permission to be bold in the remaining space.

"The only wrong answer is playing it safe" — LLMs default to hedging when given creative latitude. That closing line explicitly flips the incentive.

What to expect

Run this on Claude Opus 4.7 and you'll get a fully-formed brand concept — not just styling. In my runs I got a niche fragrance maison called SÈVE structured around the three acts of a perfume (top, heart, base), a literary imprint with a three-part manifesto structure, and a tea merchant organized around the six Chinese tea families. Each with its own palette, typography, and copy voice.

Variation is the point. If the model picks the same concept twice in separate sessions, it's pattern-matching, not reasoning about the brief. Opus 4.7 doesn't do that here — genuine different outputs.