Oculay — CSS & Design Inspector with Tailwind/React Export
Unknown author · Developer Tools
Media
3 items
Description
Inspect fonts, colors & spacing on any page. Copy as Tailwind, React, or Vue — ready to paste into your AI coding tool. Stop switching between DevTools and Figma just to answer "what font is this? how much padding?" ◆ What it does ✓ Hover any element to instantly see font, size, line-height, colors, spacing, and radius ✓ Extract the page's full color palette and font list ✓ Visualize Flexbox / Grid layout structure ✓ Copy inspected styles as Tailwind classes, React, or Vue code in one click ✓ Extract assets from the page ✓ Figma-like side panel UI that stays out of your way ◆ Made for - Frontend engineers doing design QA (spec vs. implementation) - Designers & PMs checking how things were actually built - AI-assisted coding: copy real styles from any site and paste them into Claude, Cursor, or your favorite AI tool as precise context ◆ How to use 1. Click the Oculay icon 2. Hover / click the element you want to inspect 3. Copy in the format you need (Tailwind / React / Vue) ◆ Permissions - activeTab: inspects only the tab you're on - Access to all sites: so it works on any page you choose. No browsing data is collected or transmitted - sidePanel: displays inspection results ◆ Privacy Everything runs locally in your browser. No history or page content ever leaves your device. Actively developed — feature requests and bug reports are very welcome via the Support tab.