Landing Page Builder: Ad Angle to Working LP

Paste-ready prompt for Claude Code. Drop four files in a folder, paste this prompt, get back a working index.html you can open in a browser.

What to put in the folder

1. The winning ad as an image (PNG or JPG). The full ad with the headline visible.
2. Brand image library as a folder of images. Fastest way: install the free Chrome extension Imageye (https://chromewebstore.google.com/detail/imageye), open the brand’s product page, click the Imageye icon, hit “Select all,” download as zip, unzip into your project folder.
3. Brand bible as a markdown file called brand-bible.md. If you do not have a formal one, paste the brand’s About page text and PDP product description. Five paragraphs is enough.
4. Persona note as a one-line text file called persona.txt. Example: “Busy professional, 35 to 55, does her makeup in five minutes, hates rituals, values efficiency over expression.”

The prompt

Paste this into Claude Code:

Read the ad image, the brand image folder, brand-bible.md, and persona.txt in this folder.

Build me a single self-contained index.html for a landing page that rhymes with this ad. Use the brand image folder as your photographic source. Pick the strongest hero, lifestyle, and product shots from what is in there. Do not invent images. Wire the chosen filenames into the HTML.

Rules:
- The H1 of the page is the ad's headline, verbatim.
- The page voice matches the brand bible. If the bible lists banned words, do not use them. If it specifies a tone, obey it.
- Every section of the page earns the ad's promise, in language the persona uses.
- The page has these sections in this order: hero, USP icons row, problem section that names the persona's pain, solution section showing what the product does, founder paragraph in the founder's voice from the bible, buy block linking to the brand's real product URL (ask me if you do not have it), compare table, how-to steps, reviews pulled from the brand's site or bible, FAQ tuned to this persona's hesitations, guarantee strip, final CTA that restates the hero promise.
- No invented claims. If you cannot support a section from the ad, the bible, or a real review, leave a [NEEDS BRAND INPUT] placeholder.
- No em dashes anywhere.
- Use the brand's palette and typography from the bible.
- The page is a single file with inline CSS and inline JS. I want to open it in a browser and have it work.

Ask me at most three clarifying questions before you write. Then write the file.

After Claude Code writes the file

Open index.html in a browser. Iterate in the same conversation:

• “The hero is too dense, cut the sub-line.”
• “The compare table needs a row about time.”
• “Make the FAQ match the persona’s actual hesitations.”
• “The CTA should say ‘Get ready in 30 seconds’ not ‘Shop now.’”

Claude Code edits in place. Keep going until the page feels right.