TLDR: When you describe the output you want in words, the AI fills the gaps with its most average guess, so the style drifts. When you paste a concrete example and say build mine like this, there is nothing to guess. Language models are built to continue patterns, so a real example, one finished section, a layout you like, a sample of your data, is the strongest instruction you can give. This is example-driven prompting, and the copy-paste patterns are below.
You can feel the difference the moment you try it. Spend ten minutes stacking adjectives onto a prompt, “clean, modern, minimal, premium, lots of whitespace,” and the page still comes back looking like a template. Then paste one snippet of a layout you actually like, say “build mine the same way with my content,” and the first draft lands. Same model, same content. The only thing that changed is that you stopped describing and started showing.
This is the single highest-leverage move in prompting, and it is underused because describing feels like the natural way to ask. It is not. The reliable way to prompt AI is with an example.
Why does describing a style never quite work?
Words about a style are compression, and the AI has to decompress them. “Modern” means a dozen different things, so the model averages them. “Premium” is a vibe, not a spec. Every adjective you add is another decision you have handed to the model’s defaults, and defaults are what generic is made of. A prompt written like a spec closes a lot of those gaps, and you should still write one. But some things are almost impossible to pin down in words: an exact layout, a particular rhythm of sections, the precise shape of an output. For those, description will always drift.
An example does not drift. A language model is, at heart, a pattern-continuation engine. It was trained to look at a piece of input and produce the most likely continuation. When you give it a finished thing and ask for more of the same, you are feeding it the exact kind of signal it is best at following. A paragraph of adjectives asks the model to invent a pattern. An example hands it one.
The four examples worth pasting
You do not need a library of references. Four kinds of example cover almost everything you will ask an AI to build.
1. A layout you want to borrow
When the structure is what you care about, find a page or component whose bones you like and hand the model its markup. You are not stealing the design, you are borrowing the skeleton and filling it with your own content.
Here is the HTML structure of a section I like:
[paste the snippet: the hero, the pricing cards, the feature grid, whatever it is]
Build my version using the same layout and spacing, but with my content:
- Headline: [your headline]
- Three features: [your three features]
- Button: [your call to action]
Keep it a single self-contained HTML file. Match the structure of the example, not its exact words or colors.This beats “make it look like Stripe’s pricing page” because the model does not have to remember what that looks like. It is looking right at the pattern you want.
2. One finished unit to repeat
This is the one that saves the most time. Anything that repeats, cards, list rows, slides, team-member blocks, is a place where AI output tends to wander, with each item styled a little differently. The fix is to perfect one, then make the rest match it.
Here is one team-member card, exactly how I want every card to look:
[paste the one card's HTML]
Create the other five cards in the identical structure, same classes, same spacing, same markup. Only the name, role, photo, and bio text change. Return all six together.The model copies the pattern across every item, so you get consistency for free instead of fighting for it card by card.
3. A good-versus-bad pair
Sometimes the fastest way to steer is to show the model both a miss and a hit. A matched pair teaches the direction you want far more precisely than an adjective, because the contrast carries the meaning.
Here are two versions of a headline. The first is the kind I do not want. The second is the tone I do want.
Too generic: "Welcome to our platform, the all-in-one solution for modern teams."
What I want: "Your invoices, paid in a day. Not thirty."
Write five headline options for my product in the second style: concrete, specific, short. My product: [one line about it].Pairing a bad example with a good one is also how negative prompting for AI pages earns its keep. You are drawing a line and pointing to the side you want.
4. The exact shape of the output
When the format matters, a table, a set of data objects, a repeated block of markup, show one filled-in instance and ask the model to follow it exactly. One example of the shape removes an entire category of back-and-forth.
Format every product as a block exactly like this one:
{
"name": "Trail Runner 2",
"price": "$128",
"badge": "Best seller",
"blurb": "A one-line description, 8 to 12 words, present tense."
}
Here is my raw product list; convert all of it to that exact format:
[paste your list]Describe or show: which does what
Showing does not replace describing. They do different jobs, and the best prompts use both: a short description to set intent, an example to pin down the specifics words cannot.
| Describe it | Show it | |
|---|---|---|
| Good for | Goal, audience, the single action you want | Layout, tone, repeated structure, exact format |
| What you give the model | Adjectives and instructions | A finished pattern to continue |
| How the model responds | Fills gaps with its safest default | Mimics the pattern you handed it |
| Failure mode | Drifts toward generic | Copies too literally if you forget to say what can change |
| Best used | To frame the request up top | To lock the specifics a description cannot |
The one caution is in that last row. An example is so strong a signal that the model may copy things you did not mean, the exact colors, the sample text, the dummy numbers. So say what should stay and what should change: “match the structure and spacing, but use my content and my green accent color.” A sentence of guidance keeps the copy from being too literal.
Where do you find the example?
You usually already have one. A component on a site you admire, viewable from its page source. A past project whose layout worked. A single item you can mock up by hand in thirty seconds. And the most practical source of all: have the AI build one small piece first, iterate until that piece is exactly right, then paste the approved piece back as the example for everything else. You art-direct once, and the model repeats your decision everywhere. It pairs naturally with briefing AI like you would brief a designer and with a tight loop of follow-up prompts to polish the result.
If the example you want to match is visual rather than structural, a design mockup, a screenshot, a photo of a sketch, you can hand that over too. That is prompting with reference images, the same principle applied to pictures: show the model the thing instead of describing it.
Publish the result and reuse it as your next example
Once the model has matched your example and the page looks right, you need to see it at full size, on a real screen, with every button and animation working, before you trust it. A page in a chat window is not the same as a page a person can open.
That is where VisiblePage comes in. Paste the HTML the AI produced, or drop a ZIP if the project came as several files, and you get a live URL in seconds, with no build step, no server to set up, and no domain to configure. Every interaction still works, because you are sharing the real page, not a screenshot. Keep it public, private, or password-protected while you refine, and when a new round of prompts improves the page, re-publish to the same link so the URL you already shared always shows the latest version. There is a bonus here, too: a page you published and liked becomes the perfect example to paste into your next prompt, so each project raises the floor for the one after it.
Try it now: Publish your AI-generated HTML with VisiblePage and get a live link in seconds.
Frequently asked questions
How do I get AI to match a style I like? Show it, do not describe it. Paste an example of the thing you want, a snippet of HTML whose layout you admire, one finished section, or a page whose tone fits, and say build mine the same way with my content. A concrete example anchors the model to a specific pattern, while a paragraph of adjectives leaves it to guess. If you want the look of a page you already have, paste that page’s code as the reference.
What is example-driven prompting? It is giving the AI a worked example of the output you want instead of only a description of it. You paste one finished unit, a sample layout, a good-versus-bad pair, or the exact format of a single row, and ask the model to continue the pattern. Language models are built to continue patterns, so a real example is the strongest signal you can give them, far stronger than more adjectives.
How do I make AI format every section the same way? Build and perfect one section first, then paste it back and say make the rest exactly like this one. The model copies the structure, spacing, and markup of your example across every remaining item, so your cards, list rows, or slides come out consistent instead of each one being invented from scratch.
Should I describe the output or show an example? Do both, but let the example carry the weight. A short description sets intent and an example pins down the specifics the description cannot. When the two ever conflict, the model tends to follow the example, which is exactly why a good one is worth pasting. Describe the goal, show the pattern.
Where do I get an example to give the AI? Use a page or component you already like: view its source, or ask the AI to first build one small version you approve of, then reuse that approved piece as the example for the rest. You can also paste a filled-in sample of your data or one finished item. The example does not need to be polished, it just needs to show the pattern you want repeated.