Show HN: GetEles, a browser extension that helps you easily understand webpages
Hey HN, I used to be a frontend engineer, but for the past two years, I've been working as an independent developer. I'm building tools to solve problems I encounter in my daily workflow.
Every day, I use F12/devtools to debug web pages. Honestly, I often just want to see how an element is written or which styles are affecting my layout. In 2024, I upgraded to a new laptop with a smaller screen (14") compared to my old one. Now, whenever I press F12, the webpage gets squeezed, sometimes even switching to mobile view. This frustration inspired me to create GetEles, named after JavaScript functions like getElementsBy*.
What can GetEles do?
1. Quickly get website info: title, description, color scheme, resources, etc. 2. Quickly inspect element details: classes, inline styles. 3. Quickly locate elements (I've traversed the DOM for you!). 4. Quickly convert element styles to Tailwind CSS. 5. Precisely measure the distance between any two elements. 6. Quickly export screenshots of elements or the entire page. 7. Get page load times and performance info...
GetEles is free to use, though some advanced features require a subscription. Even so, I highly recommend trying out the experience on the official website first – it includes over 90% of the functionality.
Head over to the website and click "Try it out":