Analyze fonts, colors, and style information from web pages and save them to the side panel.
Users
18
+3 in 30 days
Rating
0.0 / 5
unchanged in 30 days
Ratings
0
0 in 30 days
Store rank
#157K
#130K among extensions
Version
1.3
updated 12 Jan 2026
Users
monthly, 10 months
Latest, 15 Oct 2026:18 usersMove the mouse over the chart for any month
Ratings count
monthly, 10 months
Latest, 15 Oct 2026:0 ratingsMove the mouse over the chart for any month
The Chrome Web Store rounds user counts down to the leading digit, so the user line moves in steps. The ratings count is exact and is the better signal of real adoption.
About SideStyle - CSS Inspector
SideStyle - Professional CSS Inspector & Style Saver
SideStyle is a powerful tool for web designers and developers that allows you to inspect, capture, and organize CSS styles directly within the Chrome Side Panel. Stop digging through complex DevTools and start building your style library with a single click.
【Key Features】
・Instant Style Inspection: Hover over any element on a webpage to see it highlighted, then click to instantly capture its CSS properties.
・Comprehensive CSS Data: Extracts detailed information including:
・Typography: Font family, size, weight, line height, and letter spacing.
・Colors & Decoration: Text color, background color (with visual color chips), border-radius, and box-shadows.
・Layout & Box Model: Padding, margin, and exact dimensions (width/height).
・Side Panel Workflow: Captured styles are displayed in the Chrome Side Panel, allowing you to reference them without switching tabs or losing focus.
・One-Click CSS Copy: Easily copy the entire CSS block of an element or individual property values to your clipboard for use in your projects.
・Persistent History: Your inspected styles are automatically saved to local storage, so they remain available even after you restart your browser.
【How to Use】
1. Open the SideStyle panel by clicking the extension icon.
2. Click the "Get Style" button to activate the inspector.
3. Hover over any element on the page to see the blue highlight.
4. Click an element to save its styling to your side panel list.
5. Click any value to copy it, or use the copy icon for the full CSS rule.