Free tool
Image to Tailwind
Upload a UI screenshot or mockup. Claude vision recreates it as a clean React component styled with Tailwind CSS. Copy the code, paste into your project, ship.
1. Upload a screenshot
PNG, JPEG, WEBP, or GIF. Maximum 1 MB. Your image is sent to Claude for one inference and is never stored.
or paste base64 / data URL below
FAQ
How does this tool work?
You upload a UI screenshot or paste a base64 image. The image is sent to Anthropic's Claude vision model with a prompt that asks for a single React component using Tailwind CSS. The generated TSX is returned and shown with a copy button.
Is my image stored?
No. The image is forwarded to the model for one inference and discarded. We do not log, cache, or persist uploaded images.
What is the size limit?
1 MB per image. PNG, JPEG, WEBP, and GIF are supported. Larger files are rejected to keep the tool fast and inexpensive.
Are there rate limits?
Yes. Each IP gets 5 requests per 15 minute window. Vision inference is more expensive than text, so we cap usage to keep the tool free.
How accurate is the output?
The output is a strong starting point that captures layout, spacing, color, and component structure. Expect to refine details, swap placeholder assets, and wire up real data and state.
Which model is used?
A current Claude vision model. The default targets the latest Sonnet release for a balance of cost and quality.
Get more tools like this
One email a week. Tutorials, open source projects, and free dev tools. No spam.
More free dev tools
Related reading
Blog
Best Claude Model Now That Fable 5 Is Disabled (Mythos vs Opus vs GPT-5.5)
Fable 5 and Mythos 5 are gone for now. Here is the honest ranking of what to use today, from Opus 4.8 to GPT-5.5 to open-weight models, by task.
Blog
Claude Mythos vs Fable 5: What Is the Difference?
Mythos 5 and Fable 5 are the same underlying model. The difference is who can use it and what safeguards sit on top. Here is the breakdown, and why both got suspended together.
Blog
Is Claude Fable 5 Down? Why It Is Unavailable (June 2026)
Claude Fable 5 and Mythos 5 are unavailable for everyone as of June 12, 2026. It is not an outage. The US government ordered Anthropic to suspend access. Here is the status, the cause, and what to use instead.
Blog
The US Government Just Pulled Fable 5: What Happened
Anthropic received an export control directive at 5:21pm ET and had to disable Fable 5 and Mythos 5 for every customer. Here is what we know, what still works, and what to do if Fable is in your stack.