Frontend Hero — Console Spy
Your console, without giving up half your screen.
DevTools steals half your screen just to see console.log output. Console Spy gives you a compact panel with filters and search. Keep your workspace.
11 developer tools. One extension. $98 $59 one-time · 3-day money-back guarantee
A better way to read your console
Full Console, Compact Panel
Logs, warnings, errors, and info — all in a slim side panel. See everything without opening the heavy DevTools.
Filter and Search
Show only errors, only warnings, or search for specific messages. Cut through the noise instantly.
Keep Your Full Screen
DevTools takes up 50% of your viewport. Console Spy stays compact so you can actually see your page.
Get started in 3 steps
From install to your first use in under 30 seconds.
Open Console Spy
Click the Frontend Hero icon and select Console Spy. It starts monitoring immediately.
See messages in real-time
Logs, warnings, and errors stream into a compact panel as they happen.
Filter what matters
Toggle message types on/off and search through output to find exactly what you need.
When Console Spy is useful
Frontend Developer
Monitor console output while testing UI interactions — without losing screen space.
QA Engineer
Spot JavaScript errors on any page without needing to open DevTools.
Developer Debugging Hover States
DevTools messes with :hover and :focus states. Console Spy lets you monitor output without interfering.
"Honestly I was skeptical about paying $59 for a browser extension, but the CSS Scanner showing hover and focus states is something no free tool does properly. Console Spy is a nice bonus too."
Sarah Chen
Full Stack Developer
One-time purchase. 11 tools included. 3-day money-back guarantee.
Console Spy + 10 more tools for $59
Every Frontend Hero license includes all 11 tools. No add-ons, no upsells.
CSS Scanner
Inspect any element's styles in one hover
Font Explorer
See every font on any page at a glance
Color Palette Explorer
Extract the full color palette from any site
Color Picker
Pick any color — copy as HEX, RGB, HSL, or Tailwind
Tailwind Scanner
Inspect, toggle, and edit Tailwind classes live
Tailwind Converter
Click any element, get its Tailwind classes
Element Screenshot
Click any element, get a perfect screenshot
Page Ruler
Measure anything on any page, pixel-perfect
Asset Spy
Download every image from any page — even hidden ones
Text Edit Mode
Change any text on any page — without code
Get Frontend Hero Today
One license = One browser. Use on multiple devices? Get multiple licenses.
Each license works on one browser. Need team licenses? Email sales@frontend-hero.com for volume discounts.