Chrome extension · GPT-4o vision · BYOK

Stop describing UIs to your LLM.
Screenshot them.

BetterSkillsMD reads any web page and writes a paste-ready design.md — colors, typography, layout, components — ready to drop into Claude, ChatGPT, or Cursor and ship the build.

  • 5 free captures
  • ·
  • $10 one-time after
  • ·
  • No subscription
BetterSkillsMD side panel showing a captured screenshot streaming into design.md while the source page is visible behind it
A live capture in the side panel.

You've been here before.

01

You see a site you'd like to build something like — but explaining the feel of it in plain English loses half the detail.

02

You spend 20 minutes typing a brief from memory. Your LLM still misses the hex codes, the spacing rhythm, the typography choices.

03

You iterate five times: "more rounded," "bigger headline," "slightly off-white background." Each round burns time and tokens.

There's a faster way.

One screenshot. Ten seconds. A complete spec.

How it works

Three clicks to a paste-ready spec.

  1. Step 1

    Connect your OpenAI account

    Drop your sk-… key into the options page, click Test, you're done. The key is stored only in chrome.storage.local, isolated to this extension, and is never sent anywhere except api.openai.com — that's enforced by the manifest, not a promise.

    Options page with OpenAI API key field, Test button showing 'Key works', model selector, and history settings
  2. Step 2

    Capture your favorite site for inspiration

    Click the BetterSkillsMD icon, pick a capture mode, watch it stream. Visible viewport, full page (auto-scrolls and stitches), drag-a-region, or click-an-element — whichever is the right grain for what you're cloning.

    A cycling-coach landing page with the BetterSkillsMD side panel open, showing a captured thumbnail and the markdown spec
  3. Step 3

    Send the design file to your favorite LLM

    Copy or download design.md. Paste into Claude, ChatGPT, Cursor, v0, Lovable — any LLM you build with. The output covers layout, hex-coded color palette, typography rules, component inventory, and (optionally) verbatim copy.

    The Markdown tab of the side panel showing a generated design.md with sections for Overview, Layout, Visual Style, and a color-palette table with hex values

Capture exactly what you need

Four capture modes, one design spec.

Visible viewport

Capture exactly what's on screen right now.

Full page

Auto-scrolls and stitches the entire page, top to bottom.

Drag a region

Pick out a single section — just the hero, just the card.

Click an element

Hover-highlight any DOM element and click to capture exactly its bounding box.

Streaming markdown preview. Watch the spec write itself in the side panel as the model thinks.
Local history. Your last 20 captures are saved locally — revisit anything.
Inline editor. Tweak the markdown before you copy or download.
Bring your own key. We don't host a model. You control your costs and your data.

Honest pricing

No subscription. Ever.

$10 one-time · forever
  • 5 free captures to try it
  • Unlimited captures after upgrade
  • All four capture modes
  • Streaming markdown · local history · editor
  • Bring your own OpenAI key (you control the cost)
  • Stripe-backed checkout
  • 7-day refund, no questions
Add to Chrome — Free

You only pay when you've used your 5 free captures and want to keep going.

Your key never leaves your machine

Stored in chrome.storage.local, sent only to api.openai.com.

Screenshots stay local

We never see your captures. History lives on your machine.

No tracking, no analytics

The extension talks to OpenAI and ExtensionPay. That's it.

Questions, answered.

Do you store my screenshots?

No. Screenshots stay on your machine. The image is sent to OpenAI for analysis only — neither we nor any third party persist it. Your captures live in chrome.storage.local, which is per-extension, isolated, and removed if you uninstall.

Why bring-your-own-key?

Two reasons. One: we don't host an AI service or pay your OpenAI bill, so you stay in control of cost. Two: your captures travel directly between you and OpenAI — there's no middleman who could log, store, or train on your screenshots. The manifest enforces that api.openai.com is the only outbound destination for the key.

Can I get a refund?

Yes. Within 7 days of purchase, no questions asked. Reach out via the support link below.

Will it work on any website?

Almost any. Some sites with sticky headers pinned via CSS transforms can produce duplicated bars in stitched full-page captures — viewport / region / element modes always work. We're improving the stitcher continuously.

Why $10 once and not a subscription?

Because most people use this once a week, not every day. Subscriptions for tools like this are gross. Pay once, keep using it.

What model does it use?

OpenAI's gpt-4o by default for best vision fidelity, with gpt-4o-mini available in options for cheaper / faster captures. Toggle in settings any time.

Try it on the next site you want to clone.

Free for 5 captures. $10 once after that. No subscription.

Add to Chrome

Chrome Web Store link coming soon — install from source in the meantime.