AI Web Design Without the AI Look: Which Design Decisions to Hand Claude and Which to Keep

You can spot an AI-built page from the first scroll. Centered hero, gradient background in a color that's purple-adjacent, three feature cards with emoji icons, a testimonial row, a big rounded CTA button. It's not that any single element is wrong — it's that the model made every decision, and when an LLM makes every decision, it reaches for the median. The median of everything it has ever seen is exactly the page you're picturing right now.

We've covered the build side of this before — 5 Landing Page Examples, Torn Down to the Studs shows how to rebuild proven patterns with Claude, and Before Claude Writes a Line of Code covers turning your brief into wireframes before any HTML exists. This post is about the decisions inside that build. Which ones does Claude handle well on its own, and which ones are yours to make before you type a single prompt?

Why Claude defaults to the beige

An LLM doesn't have taste. It has a probability distribution over everything it's read — and the training data for "make a landing page" is overwhelmingly tutorials, templates, and Tailwind component galleries. Ask for a landing page with no constraints and you get the intersection of all of them: Inter font, slate-900 text on white, a hero that says something like "Supercharge your workflow."

The fix isn't better prompting alone. It's understanding that design decisions fall into two buckets: structural decisions, where the median answer is usually fine, and identity decisions, where the median answer is the whole problem.

Hand these to Claude

Layout hierarchy, given a goal

If you tell Claude the conversion goal and the reading order you want — "headline, then social proof, then the three objections, then CTA" — it will build a competent hierarchy every time. Spacing rhythm, section stacking, responsive breakpoints, where to put whitespace: this is pattern-matching work, and the pattern is well-established. You'd make the same calls.

Typography mechanics

Font sizing scale, line height, letter-spacing on small caps, whether the body copy is readable at 16px on mobile — delegate all of it. Claude is better at typographic craft than most humans who aren't designers. What it's bad at is picking the typeface, which is the next section's problem.

Mobile behavior

Responsive collapse patterns — when the nav becomes a hamburger, how the two-column layout stacks, whether the CTA sticks to the bottom on small screens — are solved problems with known-good answers. This is some of the highest-value delegation there is, because mobile behavior is tedious to hand-tune and Claude rarely gets it wrong when you prompt for it explicitly.

Accessibility mechanics

Contrast checking, focus states, aria labels, semantic HTML. Ask for it explicitly — "audit this page for WCAG contrast issues and fix them" — and it'll do work most hand-built sites never get.

Keep these for yourself

The typeface

This is the single most visible identity decision on the page, and it's where the AI look concentrates. Inter and Roboto are the default fonts of machine-generated design. If you let Claude pick, you get one of them.

Pick the font yourself from a shortlist, then hand it to the model as a constraint: "Use Fraunces for headings and Source Sans for body, load from Google Fonts." Ten seconds of your time, and the page immediately stops looking generated.

Color — at least the anchors

Claude will produce a coherent palette on request. It will produce the same coherent palette for everyone else too: a saturated blue or violet, a neutral gray ramp, maybe a coral accent. The palette isn't wrong; it's unowned.

What you should own: one primary brand color and one accent, chosen for your actual brand, stated as hex values in the prompt. What Claude handles well from there: generating the gray ramp, the hover states, the success/error colors, and keeping contrast accessible. Delegate the derivation, own the seed.

The voice of the headline

Design and copy are the same decision on a landing page. A headline like "Unleash Your Potential" versus "Ship invoices in 4 minutes" implies completely different layouts — the first needs a big aspirational hero, the second wants a product screenshot up top and no hero to speak of. If you let Claude write the headline and design around it, it designs around its own generic copy. Write the headline yourself, then prompt the layout.

Anything deliberately odd

The pages people remember have one wrong thing in them: a giant type treatment, an off-grid layout, a brutalist form, a sticky marquee. Claude will not produce these unprompted because they're statistically rare, and statistically rare is what the model is built to avoid. If you want a page with a point of view, the point of view has to arrive from outside the model — in the prompt, as a reference, or as a constraint like "no gradients, no rounded corners, no center-aligned text."

Prompt patterns that break the default

A few patterns we've used repeatedly:

The anti-default clause. Add to any design prompt:

Do not use: Inter, Roboto, or system-ui as the primary font.
Do not use: purple/blue gradients, glassmorphism, or centered
hero sections. Assume I have seen a thousand AI-generated pages
and build something that would not be mistaken for one.

This works better than it should. Naming the clichés pushes the model off the median.

Reference-anchored prompting. Instead of describing a vibe ("clean, modern, trustworthy" — Claude has produced the same page for every word in that sentence), name a concrete site or describe a specific existing design: "Structure the layout like Stripe's pricing page: left rail navigation, dense type, no illustration."

Constraint-first ordering. Give identity decisions before the build request, not after. "Here's my brief, my fonts, my two colors, and my headline. Build the page." versus "Build a page, then I'll give feedback." The second workflow is how you end up iterating toward generic — each revision nudges back toward the median.

One odd thing per page. Prompt for exactly one deliberate deviation: "Pick one element to treat unusually — the section numbers, the button shape, or the heading scale — and push it further than feels comfortable." It's a cheap way to get pages that look like someone was in the room.

The division of labor in one line

Claude owns the mechanics — layout logic, spacing, responsive behavior, accessibility, the gray ramp. You own the identity — the typeface, the anchor colors, the headline, and the one thing on the page that's deliberately strange.

If you've already got a page built and it reads as generic, this is also the fastest path to a fix: don't rebuild, re-seed. Swap the font, set two brand colors, rewrite the headline, and ask Claude to adjust the layout to match the new headline's register. That's a 20-minute revision, not a rebuild — and it's the difference between a page that looks like AI made it and a page that looks like you made it with good tools.