How to make a $1 AI website look like a $10k build

An AI can generate a whole site in one prompt. It will still look generated. Here is the short list of things that give it away, and how to fix each one in an afternoon.

Published August 6, 2026 · By Dmitry Tolstoi · 9 min read

You typed a paragraph, waited forty seconds, and got a working website. Hero, three feature cards, a pricing table, a footer. It cost you roughly a dollar in tokens. Then you looked at it and felt something you could not name: it works, it is not broken, and it still looks like it cost a dollar.

That feeling is not mysterious. Cheap sites fail in a small, repeatable set of ways, and almost none of them are about code quality. A studio charging five figures is not writing better CSS than your model. They are making about twenty decisions your model never made, because nobody asked it to. This guide is that list of decisions, in the order that changes the most for the least work.

What actually makes a site look cheap

In short: visitors judge six surface things in about a second, and a generated page usually gets all six wrong at once.

Show a generated page to a designer and they will tell you it looks off before reading a word. Here is what they are reacting to.

• The default font. System sans at default weight and default line height. It is not ugly. It is anonymous, and anonymous reads as unfinished.
• Everything at one importance. Headline, body, caption and button all shout at roughly the same volume, so the eye has nowhere to land first.
• Random spacing. 24 pixels here, 30 there, 18 inside the card. No two gaps agree with each other, and the page feels assembled rather than composed.
• The stock gradient. Purple-to-blue behind white text, three emoji as feature icons, a frosted-glass card. These were fresh once. Now they are the signature of a template.
• Dead interaction. Buttons that do not respond to a cursor, links with no focus ring, forms that say nothing when they fail. The page is a picture, not a product.
• Copy that says nothing. "Transform your workflow with AI-powered solutions." Every generated site has this sentence. Your visitor has read it two hundred times this year.

Notice what is missing from that list: layout, framework, animation, dark mode. Those are what people rebuild first, and rebuilding them almost never fixes the problem.

Typography does most of the work

In short: one family, three sizes, two weights, one line length — this single change buys more than anything else on the page.

Expensive sites are usually set in one typeface. Not two, not a display font plus a body font plus whatever the icon library shipped. One family, used at a few deliberate sizes, so the page reads as a single voice.

Concretely, this is what to set and then stop touching:

• Body text at 17 to 19 pixels. The browser default of 16 is a floor, not a target. One step up is the cheapest way to make a page feel considered.
• Line height near 1.65 for body and near 1.1 for headings. Generated sites use one value everywhere, which leaves headlines loose and body copy cramped.
• Line length of 60 to 70 characters, not a percentage of the window. On a wide monitor, full-width paragraphs are genuinely hard to read, and readers feel that as cheapness without knowing why.
• Two weights, far apart. Regular for body, semibold or bold for headings. Four weights sitting close together look like indecision.
• Negative letter spacing on large headings, around minus 0.02em. Display type at default tracking looks unfinished the bigger it gets.

Pick any well-drawn typeface and host the file yourself as woff2. Self-hosting is not only about speed or privacy: a font served from somebody else's CDN is one outage away from your site silently falling back to system sans, which is exactly the look you are trying to leave behind.

One accent colour, and the contrast ratio to prove it

In short: a neutral scale plus one accent beats a five-colour palette, and contrast is a measurement rather than an opinion.

Generated palettes hand you five saturated colours and use all of them. Studios do the opposite: neutrals doing almost all the work, and one accent that appears rarely enough to still mean something. When that accent lands on a button, it reads as "this is the action," because nothing else is competing for the job.

What separates a professional build from a merely good-looking one is that the professional has numbers. The accessibility standard sets the bar and any contrast checker will give you the figure in seconds: body text needs at least 4.5 to 1 against its background, large text 3 to 1, and interface parts such as button edges, input borders and focus rings also 3 to 1.

Here is the part that trips up almost everyone, and it matters more than it sounds. Contrast is a property of two colours together, never of one colour on its own. Take #6b7280, the mid grey that AI tools reach for whenever they want secondary text. Against a white page it measures 4.83 to 1 and passes. Against the near-black background of a page like this one it drops to 4.19 to 1, under the 4.5 to 1 the standard asks for body text, so it fails. Same grey, opposite verdict. On a dark theme, lighten it until it clears the bar: #8fa0b5 on that same dark background measures 7.58 to 1, and costs nothing.

Dark mode is where cheap sites go to hide, and it is where they are most obviously cheap. Grey on grey is not moody. It is unreadable in daylight.

Spacing is a system, not a feeling

In short: pick one step, make every gap a multiple of it, and give related things less air than unrelated ones.

Choose a base unit, 4 or 8 pixels, and let every gap on the page be a multiple of it. That alone removes the assembled feeling, because the eye reads consistent rhythm as intent.

Then apply the rule most generated layouts break: space belongs to what it separates. A heading sits close to the paragraph it introduces and far from the section above it. Templates tend to put equal space above and below every heading, which visually orphans it and makes long pages hard to scan. Three times more space above a heading than below it is a good default.

The same principle runs through cards, forms and navigation: labels near their inputs, help text nearer still, unrelated groups pushed apart. When a designer says a page breathes, this is what they are describing, and it is entirely mechanical.

Hover, focus, error: the states AI skips

In short: a product has states and a template has one, so building the missing ones is where a page starts feeling alive.

Ask for a landing page and you get the happy path at rest. Every interactive thing on that page needs more than one appearance, and this is where a dollar of generation reliably stops:

• Hover on anything clickable, plus a pointer cursor. Subtle is fine. Absent is not.
• A visible focus ring you never delete without replacing. Keyboard users navigate by it, and a page where you cannot see where you are is broken rather than minimal. A thick outline with a small offset, visible on both light and dark surfaces, is the entire fix.
• Active and disabled styles on buttons. A button that looks identical while it is submitting invites the double click that creates two orders.
• Empty and error states in words. "No results yet" beats a blank rectangle, and a form that fails silently is the cheapest-feeling thing on the internet. Say what went wrong, next to the field it went wrong in.
• Touch targets of at least 24 by 24 pixels, ideally 44. Tiny footer links are proof that nobody opened the page on a phone.

None of this is expensive. It is simply work nobody asks for, so no model volunteers it.

Speed and weight are part of the look

In short: expensive feels instant, so ship only the fonts you use, size images to their slots, and cut the JavaScript you do not need.

A marketing page carrying several megabytes of framework to render text is not a design problem, but it reads as one. The page paints late, the layout jumps as things arrive, and the visitor's finger is already moving to the back button.

Three fixes cover most of it. Serve images at the size they are displayed and in a modern format, instead of pushing a 3000-pixel hero into a 1200-pixel slot. Give every image explicit width and height so nothing shifts while it loads. And be honest about whether the page needs a framework at all: a static page of text and links is faster, cheaper and more durable than the same thing rebuilt as an app.

Then set the small things every professional build has and no generated one does: a real favicon, a page title that is not "Home", a meta description, and social preview tags with an image. The first time someone pastes your link into a chat and it renders as a naked string, the site looks abandoned.

Your writing gives you away faster than your design

In short: replace every adjective with a number, a name or a specific noun, because vague wording is the loudest signal that nobody thought hard about this.

"Powerful platform for modern teams" tells a reader nothing, and they know a machine wrote it in under a second. Specifics are what expensive brands sound like, and specifics are free.

• Say what it does, in the words your customer would use, before you say why it is good.
• Name the person it is for. "For solo founders running ads without an agency" beats "for everyone."
• Use real numbers you can defend. If you do not have them yet, use a concrete example instead of a borrowed statistic.
• Offer one action, repeated. Four buttons of equal weight is the same as offering none.
• Cut any sentence that could sit on a competitor's site unchanged. Then cut the next one.

What a $10,000 site actually buys

In short: not pixels but decisions, and you can make those yourself once you know they are the real deliverable.

A studio's output is not the file. It is a set of decisions someone stands behind: this is the one thing the page must accomplish, this is the order you will read it in, this is the proof we show, this is what we cut. That is why the same design system looks expensive applied by a team and looks like a template applied by a generator. The generator has no opinion about what matters on your page.

Which is good news, because opinions are the cheapest part of the build. A dollar of generation gives you the raw page in forty seconds, and the afternoon you spend imposing decisions on it is what turns it into a build. That trade did not exist three years ago at any price.

A 90-minute pass over your AI site

In short: work in this order, because the first three steps carry most of the visible change.

Steps 1 to 4 are the visual pass, and stopping after step 4 still leaves the page better than you found it. The full run adds up to 90 minutes, and the first time through it will run long — that is normal.

1. Set the type, 20 minutes. One self-hosted family, body at 17 to 19 pixels, line height near 1.65, maximum line length of 65 characters, headings tight with slightly negative letter spacing.
2. Fix the palette, 15 minutes. Neutrals plus one accent, then run every text colour through a contrast checker against the background it actually sits on: 4.5 to 1 for body text, 3 to 1 for borders and focus rings. Start with the muted grey used for captions and secondary text, because that is what fails most often. If it comes in under the bar, move it toward the background's opposite until it clears.
3. Regularise the spacing, 15 minutes. Make every gap a multiple of 8, and put three times more space above each heading than below it.
4. Build the missing states, 15 minutes. Hover on everything clickable, a visible focus ring, a disabled style, one empty state, and one error message that names the problem.
5. Strip the template signals, 10 minutes. Remove the stock gradient, the emoji feature icons, and any badge announcing which builder made the site.
6. Rewrite the top 100 words, 10 minutes. Headline, subheadline and button: a specific noun, a specific person, one action.
7. Ship the metadata, 5 minutes. Favicon, page title, description and a social preview image. Paste the link into a chat and look at what appears.

Finish with the two checks that catch what your eye stopped seeing an hour ago: open the page on a phone, outdoors if you can, and go through the whole thing with the Tab key without touching the mouse. Anything you cannot read or cannot reach is still costing you a dollar of credibility.

Where these numbers come from

• The Web Content Accessibility Guidelines, for the contrast, focus and target-size figures used above. They double as a quality bar for visual polish.
• Your browser's own developer tools: the accessibility panel reports contrast ratios on real elements, and the network panel shows exactly what you are making people download.