Thirteen web development tools in one extension, each built to be at least as good as the single-purpose tool you’d otherwise install. Every tool is free — no trial, no account, no paywall. It asks for no site access at install and only touches the page you open it on.

Inspect

  • CSS Inspector — computed styles with the rule and stylesheet each value came from; copy the element’s styles as CSS or as Tailwind classes (anything that doesn’t map is listed, never dropped)
  • Element Info — tag, classes, size, position and a unique selector; works inside open and closed shadow roots and same-origin iframes
  • Font Detector — the font family the browser actually renders, sizes in px and rem, and a page font inventory
  • Page Meta, CSS Variables and Page Assets at a glance

Colour and accessibility

  • Color Picker — a real eyedropper for any pixel, a page palette with use counts, hex/rgb/hsl/oklch, and contrast against the colour actually behind the text
  • Accessibility audit — page-wide text contrast (AA and AAA), missing alt text, empty links and buttons, unlabeled inputs, heading order and landmarks — each with a WCAG reference and a Highlight button

Measure and layout

  • Measure — size on hover, anchored distance guides with Alt, and a drag ruler
  • Grid & Flex overlay — tracks, gaps and named areas drawn on the page; keep several at once
  • Spacing — margin and padding drawn on the page, DevTools-style

Capture and edit

  • Screenshots — visible area, full page, or one element; saved as PNG and copied to the clipboard
  • Live Edit — change text, spacing, colours and font size on the page, with real undo/redo, reset, and “copy changes as CSS”

Private by design

No tracking, no analytics, no account. The extension requests no host permissions: the inspector is injected only into the tab you open it on, and only when you pick a tool. See the privacy policy.

Also from Brightbar