Develobar

A developer toolbar for any web page: screenshot, colour picker, measure and inspect.

Develobar adds a compact developer toolbar to any web page, giving you the everyday tools you reach for when building, reviewing or debugging websites, without opening DevTools. Open it on any page by clicking the toolbar icon or pressing Alt+Shift+D. Develobar only runs on a page when you open it there. Once open, it stays open when you reload the page or follow links within the same site, until you close it. **Tools included** - **Screenshot**: capture the visible area, the full scrolling page, or a region you select. Images are saved straight to your computer as PNG files. - **Colour picker**: hover over any pixel to see its colour as HEX, RGB, HSL and CMYK, with a zoomed magnifier for precise picking. Click to copy the HEX value, or click any format to copy that one. - **Ruler**: click two points to measure the distance between them in pixels. Hold Shift to snap to horizontal, vertical or 45° lines. Measurements stay in place when you scroll. - **Copy CSS**: select an element on the page to see the CSS that reproduces its look, ready to copy to your clipboard or download as a .css file. - **Accessibility**: check text contrast against WCAG AA or AAA, find missing or unhelpful alt text, review the heading outline, and spot keyboard problems such as unlabelled buttons and fields. Show the tab order on the page, and check any two colours with the built-in contrast checker. Click a result to jump to the element. - **SEO**: see the page's title, meta description, canonical, robots directives and every meta and link tag, with a search result preview and a checklist of common issues. Preview how the page looks when shared on social sites, explore its JSON-LD and microdata, and check whether robots.txt blocks the page. Links open Google's Rich Results Test, the Schema Markup Validator and PageSpeed Insights for deeper checks. - **Cookies**: see every cookie the site sets, including HttpOnly ones, with its domain, path, expiry and flags. Search, edit, add or delete cookies, and export them as JSON or a cookies.txt file for curl and wget. Cookie access is granted one site at a time, only when you choose to allow it. **Private by design** Everything happens locally in your browser. Develobar has no accounts, no analytics and no tracking, and it never sends page content, screenshots or browsing data anywhere. **Keyboard shortcut** - Alt+Shift+D: toggle Develobar (you can change this at chrome://extensions/shortcuts)