Design by reference
You do not need the words for what good looks like. You need a picture of it.
“You can just take a screenshot and give it to your AI and say copy this design.” That is the whole technique. The rest of this page is what to take, and what to leave.
This page is one move inside a bigger surface. What Claude Design is, and how to write your first prompt for it, is Claude Design →
Show
Hand over a picture, not a paragraph
Describing a design in words means guessing at a vocabulary you were never taught.
A screenshot skips all of it: the layout, the spacing, the order, how much sits on one screen.
- Can you point at something that already looks right?
- Does it do the same job as the thing you are making?
- Is the screenshot big enough to read?
Claude can view and analyse images you upload. Drag one into the chat window, or paste it straight from your clipboard. JPEG, PNG, GIF and WebP all work.
Borrow
Steal the layout, not the data
Take the shape: the arrangement, the density, what is biggest, what sits in the sidebar.
Leave everything that makes it theirs.
- Their logo, their name, their colours as a set: leave them.
- Their words, and their client’s data: leave them, always.
- Would you be happy telling the designer what you did?
A reference is not a rip-off. You are borrowing an arrangement, not helping yourself to someone’s work. If you could not tell them what you did, you have taken too much.
Point
Say what is wrong, and show it again
What comes back first is a starting point, not the answer.
Name the one part that is off, and hand over another picture if you have one.
- Which single part is wrong: the layout, the density, the colour?
- Can you show it rather than describe it again?
- Have you asked to see two or three alternatives?
Broad changes belong in the chat; one component is easier as a comment on the thing itself. In Claude Design, which is in beta on Pro, Max, Team and Enterprise, not Free.
From screenshot to first draft
The only real skill is choosing a reference that does your job.
- 1
Find one that does your job. A dashboard for a dashboard, a booking page for a booking page. A mood you like is not enough.
- 2
Grab a clean screenshot. Anthropic’s own tip is 1000 by 1000 pixels or larger, and to avoid small or low-resolution images.
- 3
Hand it over with one sentence. Name what you want from it: the layout, the sidebar, the density. Never “make it look nice”.
- 4
Say what the thing actually is. Your content, your numbers, your audience. The picture is the shape; the substance is all yours.
Keep a folder of the references that worked. The picture goes into the chat each time, so the only real cost is finding it twice.
Three places a good reference hides
Pick for the job in front of you, not for the mood.
A design site
dribbble.com is mine- Real work, by real designers.
- Search the job: dashboard, invoice, booking.
A product you pay for
you already use it- Screenshot the one screen you like.
- You already know it works.
Your own best page
the one you are proud of- Everything you make stays consistent.
- No question about whose it is.
Your own brand assets can be kept as a stored design system, so every project starts on-brand. Claude Design, in beta on Pro, Max, Team and Enterprise. Not on Free.
- Show: a screenshot beats a paragraph of design words you had to invent.
- Find: pick the reference that does your job, not the one that suits your mood.
- Borrow: the layout and the density. Never the brand, the copy or the data.
- Point: name the one part that is wrong, and show it again.
This week: screenshot one thing you like, and rebuild your worst-looking document from it.
The surface this move belongs to: Claude Design → The sentence you send with the picture: How to Prompt →
Do it with someone. Everything here is free and you can run it alone. If you would rather work through it with me, one to one, book a free 30-minute chat. No pitch.