Web SuperKit - Sidebar for Developers & Designers

Web Inspector, Element Outliner, CSS Peeper, Color Picker, Typography Dashboard, Font Extractor, Media Extractor.

Web SuperKit brings together a collection of website inspection, analysis, and productivity tools in a single browser extension. Inspect webpage elements with a powerful live inspector, view page structure using the Element Outliner, and analyze website colors through the Colors Dashboard. Explore typography details including font families, sizes, weights, hierarchy, and font sources with the Typography Dashboard. Extract and manage website assets using Media Explorer, including images, SVGs, icons, background images, and other media resources. Test websites across multiple device sizes with the Responsiveness tool, featuring synchronized scrolling, click syncing, zoom controls, and device presets. Capture full-page and viewport screenshots with the Screenshot Editor, customize backgrounds, apply gradients, add shadows, adjust padding, and export polished images. Access website metrics including performance insights, page size, load time, accessibility information, and page resource statistics. Additional tools help analyze layouts, inspect CSS properties, discover design systems, explore color palettes, identify gradients, review typography scales, visualize webpage structure, and gather website assets without leaving your browser. All tools are accessible from a unified side panel interface, providing quick access to website analysis, inspection, extraction, testing, and screenshot capabilities in one extension.