GetLayers

Inspect & copy CSS, Tailwind, colors, fonts, assets from any element. Design tool for developers & designers.

See a design you love? Hover it, click it, and it's yours. GetLayers turns any website into a source you can copy from. Inspect an element, get clean code for your stack, measure the spacing, pick the colors and fonts, and save the images, icons, videos and fonts the page uses. No DevTools digging, no screenshots and guessing. NEW in 1.3: a Downloads hub for images, icons, videos and fonts. Click now copies and pins the element. The toolbar can be placed anywhere. ★ INSPECT AND COPY IN ONE CLICK • Hover any element to see its styles, box model, typography, colors and contrast at a glance • Click to copy the code and pin the element, then move around the page with the arrow keys • Export to 10 code formats for web, mobile and design tools, from plain CSS to Tailwind or Flutter • Preview an element on its own, take a clean screenshot of it, or export all widgets as a ZIP ★ DOWNLOADS HUB (press G) • Every image on the page, including CSS backgrounds and responsive versions • Sizes are grouped and the best quality is marked, so you never save a blurry thumbnail • Convert images to another format, copy them, or copy an icon's SVG code • Fonts with a live preview, and videos, including streams saved as a single file ★ EDIT LIVE, RIGHT ON THE PAGE • Change any style and see the result instantly, with undo • Save your edits as profiles that apply automatically next time • Compare two elements side by side to see what differs • Move elements around to try a new layout ★ MEASURE LIKE A DESIGNER • Spacing overlays for padding, margin and gaps • A ruler for the exact distance between two elements • The page's color palette, an eyedropper and a font inspector ★ BUILT FOR AI WORKFLOWS • Connect your AI coding assistant through the built-in MCP server, so it can inspect elements and edit styles on a live page ★ FAST AND FRIENDLY • A toolbar you can drag anywhere, plus the Chrome side panel and a DevTools sidebar • Keyboard shortcuts for everything, press ? to see them all • Available in 20 languages FREE AND PRO The free plan includes Live Inspect, CSS and JSON copy, the color and font tools, the DevTools sidebar and a limited Downloads hub. No account needed. Pro unlocks every format, live editing with profiles, measuring tools, element comparison, screenshots, ZIP export, unlimited downloads and the AI integration. 7-day money-back guarantee. PRIVACY No tracking, no analytics, no account for the free plan. Your pages and edits stay in your browser. PLEASE NOTE GetLayers saves files that your browser already loads. Respect copyright and site terms. DRM-protected streams and YouTube videos are not supported. Website and pricing: https://getlayers.pro Questions or ideas: getlayers.help@gmail.com