Hey HN! I built Pluck — a free Chrome extension that lets you click any component on any website and copy it as a structured prompt for AI coding tools (Claude, Cursor, v0, Bolt, etc.). You can also export directly into Figma!
It (should) work on any page, including ones behind auth, since it runs entirely in your browser.
Tech stack for the curious: Plasmo for the extension, Next.js + Hono + tRPC for the web/API, Drizzle + Postgres for the DB, all in a Turborepo monorepo.
Free tier gives you 50 captures/month (should be plenty). Unlimited is $10/mo.
Would love feedback — especially on the capture quality and whether the prompts it generates actually produce good results in your tool of choice.
When you just copy the html, you get a ton of useless repeating data. This tool removed a lot of duplicated things, structures the styling in a better way where we don't spam the styling rules. The goal is to provide just the useful info, without the noise.
Having said that, it does do essentially what you described, but when prototyping fast, and not designing from scratch it's extremely useful.
Right, but that sounds like something any frontier LLM could one-shot. It’s a basic browser extension that wraps elements in the DOM and sends them to an LLM API embedded in a prompt. This would be neat as an open-source repo, but charging $10/month for this is certainly a choice.
Yeah for sure, I don't mind open sourcing it one day, but I think you'd understand why I chose current set up, since we're both on HN :D. I do think the free tier is more than enough for most people.
Is 'plucking' something and pasting the prompt into Claude the same as taking a screenshot and uploading it to Claude?
I tend to upload screenshots a lot. If 'plucking' essentially does the same thing, without cluttering my desktop with screenshots, I'd be interested in trying it out.
It's not, it actually currently doesn't even take screenshots. It actually looks at the html and includes actual structure and values from the webpage.
Thanks for asking, maybe I should make it clearer on the website I would also add a screenshot functionality later, if people feel like current approach is not enough.
Depending on your OS/screenshot tool, you can bind a key to select an area and copy it to the clipboard, then paste directly into Claude (Ctrl/Command+V). No cluttering.
This sounds like a copyright violation machine.
I say that both as someone who writes vooyrighted code and someone responsible for ensuring my company’s code doesn’t violate anyone else’s copyright.
Valid concern, but I guess screenshot feature on every computer could also be considered as copyright violation.
You're right though - don't use this tool to violate copyright please :)
I was thinking the same. Plagiarism as a service, lol
If you love plagiarising, I will not be able to stop you :(
Hey HN! I built Pluck — a free Chrome extension that lets you click any component on any website and copy it as a structured prompt for AI coding tools (Claude, Cursor, v0, Bolt, etc.). You can also export directly into Figma!
It (should) work on any page, including ones behind auth, since it runs entirely in your browser.
Tech stack for the curious: Plasmo for the extension, Next.js + Hono + tRPC for the web/API, Drizzle + Postgres for the DB, all in a Turborepo monorepo.
Free tier gives you 50 captures/month (should be plenty). Unlimited is $10/mo.
Would love feedback — especially on the capture quality and whether the prompts it generates actually produce good results in your tool of choice.
What does this do other than copy the selected HTML into a new API prompt that says “describe this”?
When you just copy the html, you get a ton of useless repeating data. This tool removed a lot of duplicated things, structures the styling in a better way where we don't spam the styling rules. The goal is to provide just the useful info, without the noise.
Having said that, it does do essentially what you described, but when prototyping fast, and not designing from scratch it's extremely useful.
Right, but that sounds like something any frontier LLM could one-shot. It’s a basic browser extension that wraps elements in the DOM and sends them to an LLM API embedded in a prompt. This would be neat as an open-source repo, but charging $10/month for this is certainly a choice.
Yeah for sure, I don't mind open sourcing it one day, but I think you'd understand why I chose current set up, since we're both on HN :D. I do think the free tier is more than enough for most people.
Hey, I mean, Steinberger got acquihired off of an Open Source repo, so...
yeah, me next xDDDD
Well, that does sound quite useful.
Nice idea.
Is 'plucking' something and pasting the prompt into Claude the same as taking a screenshot and uploading it to Claude?
I tend to upload screenshots a lot. If 'plucking' essentially does the same thing, without cluttering my desktop with screenshots, I'd be interested in trying it out.
It's not, it actually currently doesn't even take screenshots. It actually looks at the html and includes actual structure and values from the webpage.
Thanks for asking, maybe I should make it clearer on the website I would also add a screenshot functionality later, if people feel like current approach is not enough.
Depending on your OS/screenshot tool, you can bind a key to select an area and copy it to the clipboard, then paste directly into Claude (Ctrl/Command+V). No cluttering.
I'd wish there will be a wordpdress plugin can do simialr thing: one click to export any website's design to own theme.