Introduction

PocketUI is a Chrome extension. It adds a small toolbar to every website you visit, so you can save what you like about a page (a color, a font, a screenshot, a whole section) into folders, and send it on to code, Figma or your website builder.

Hover a section, click it, and it is saved as real code.

What you can save

Colors, picked from any pixel on the page.
Screenshots of an area you drag, or of the whole screen.
Fonts, gradients, images and icons (SVGs), found for you by scanning the page.
Pages, saved as a bookmark with a preview.
Components: a button, a card or a whole section, saved as real code rather than a picture.

Where it can go

Code: HTML, Tailwind, React or Vue, copied or downloaded as a file.
Figma: pasted as editable layers.
Elementor, Bricks, Webflow and Shopify: pasted into the builder as native elements, or added to your theme.
Your AI tools: Claude, Cursor and others can read your folders.

How these docs work

Every guide is a short list of things to click, in order. Labels in bold are exactly what you will see on screen. Start with Install and pin, then Sign in and take the toolbar tour.