Pluck
Documentation

Up and running in a minute.

Install once and use one capture a day free. Pro activation is optional; every capture is three clicks: open Pluck, click a component, paste into your LLM.

1 · Install

Pluck runs in any Chromium browser — Chrome, Edge, Brave or Arc.

A

From the Chrome Web Store

Install Pluck from its Chrome Web Store listing and pin the icon. The listing link will appear here when Chrome approves it.

B

Testing an unpacked build

For a local test build, open chrome://extensions, switch on Developer mode, click Load unpacked, and choose the Pluck folder. Then pin the icon.

address barChrome / Edge / Brave
chrome://extensions   →   Developer mode: ON
→ Load unpacked   →   select the "pluck" folder
→ pin the ▲ icon to your toolbar
Edge: the address is edge://extensions. Brave: brave://extensions. Everything else is identical.

2 · Use Free or activate Pro

Free works immediately: one successful component capture per local calendar day. Pluck Pro is $12 one-time for unlimited captures on up to three browsers.

  • Free needs no key. Opening or cancelling the picker does not spend the daily capture.
  • For Pro, open Pluck options and paste the licence key from your order email.
  • That browser is now activated. Repeat on up to two more — your laptop, your desktop, a second browser.
  • Moved machines and used all three? Email hello@ulogon.com and we'll free a slot.
Free mode never calls the licence server. If you activate Pro, pluckme.dev receives the licence key, a random device identifier and browser user-agent to enforce the three-browser limit. The cached Pro grant works offline and is rechecked periodically.

3 · Your first capture

Go to any live website — your own, a competitor's, a component gallery — and try it.

1

Open the picker

Click the Pluck ▲ icon in your toolbar. The page dims slightly and a highlight follows your cursor.

2

Aim

Hover the element you want. A label shows its tag, classes and size (e.g. div.pricing-card · 236×214) so you know exactly what you'll grab. Move up the tree for a bigger chunk, down for a smaller one.

3

Click to pluck

Click once. Pluck reads the element, and a small panel appears with three copy buttons.

4

Copy & paste

Pick a mode (below), the prompt lands on your clipboard, and you paste it straight into your LLM. Done.

Press Esc at any time to cancel, or click the Pluck icon again to toggle the picker off.

Output modes

After you click a component, the panel offers three ways to copy it. Same capture, different shape for your workflow.

Copy AI prompt

The default. Best for chat models.

A written instruction — "recreate this faithfully" — followed by the fonts, any keyframes, and the self-contained HTML with styles inlined. Paste into Claude or ChatGPT and it builds the component.

Copy as React

For component-based tools.

The same capture, but the instruction asks for a React component. Ideal for v0, Cursor, Lovable and Bolt.

Copy HTML only

No prose, just markup.

The cleaned, self-contained HTML on its own — when you'd rather write your own instruction, or drop it into a scratch file.

Paste into your LLM

The output is plain text, so it works anywhere you can type a prompt. A capture looks like this:

what lands on your clipboardai-prompt
Recreate the following UI component faithfully.
Match the layout, spacing, colours, typography,
borders, shadows, radii and animations exactly.

FONTS: Public Sans — load from Google Fonts.

ANIMATIONS (add these @keyframes to your CSS):
```css
@keyframes float { from{...} to{...} }
```

COMPONENT (self-contained HTML, styles inlined):
```html
<div style="padding:22px;border-radius:14px;…">
  …
</div>
```

NOTES:
- Source: https://somesite.com/pricing

Follow it with your own line — "make it a dark-mode variant", "convert to Tailwind", "turn it into a Vue SFC" — and the model has everything it needs to get the first version right.

What gets captured

Pluck sends your model the signal and drops the noise.

  • Computed styles, inlined on every node — diffed against browser defaults so only meaningful properties survive.
  • Only the @keyframes in use by the captured elements, pulled from the page's stylesheets.
  • Web fonts in use, listed with a load-from-Google-Fonts note (system fonts filtered out).
  • ::before / ::after content flagged for the model to reproduce as pseudo-elements.
  • Absolute URLs for images and links, so nothing 404s when the model rebuilds it.

Stripped out: scripts, event handlers, tracker and framework runtime attributes, and oversized inline data URIs.

Tips for clean grabs

Aim at the wrapper, not the textHover the card's edge rather than the label inside it — you'll grab the whole component in one go instead of just a heading.
Use the size read-outThe dimensions in the label tell you whether you're on the element you think you are. If it's too small, move your cursor toward the outer padding.
React mode for builder toolsv0, Lovable and Bolt think in components — start them with the React prompt and you'll skip a conversion step.
Add your own twist after pastingThe capture is the faithful baseline. One follow-up line — restyle, recolour, make responsive — turns it into exactly what you need.

Shortcuts

  • Click icon  Start the picker on the current tab.
  • Click icon again  Toggle the picker off.
  • Esc  Cancel the picker without capturing.
  • Click element  Capture it and open the copy panel.

Troubleshooting

The icon does nothing on this pageBrowser pages like chrome://, the Web Store and the new-tab page can't be scripted by any extension — Pluck flashes a small ✕ to say so. Try it on a normal website.
Nothing pastedSome sites block clipboard access. Pluck falls back automatically, but if a paste comes up empty, capture again — the panel confirms with a "copied" toast.
The capture feels too big or too smallYou grabbed the wrong level of the tree. Re-open the picker and hover a parent (bigger) or child (smaller) element — watch the label to land on the right one.
Licence won't activateCheck the key matches your order email exactly (no trailing space). Used all three browser slots? Email hello@ulogon.com and we'll reset one.

Ready to grab your first component?

Everything above takes about a minute end to end.

Use free · Pro $12Watch the flow