Designer Tools
Designer Tools is a browser extension I created to help designers and front-end developers build better websites more efficiently.
THE PROJECT
Frustrated by the lack of effective browser tools for aligning and inspecting elements, I built Designer Tools to integrate essential design utilities directly into the browser, streamlining the workflow. By integrating familiar design utilities into the browser environment, Designer Tools bridges that gap, simplifying the workflow.
At the start, Designer Tools was a simple Chrome extension with a few basic features. It slowly gained traction as designers and developers discovered its utility. After a few months, there were around 250 weekly active users, and I decided to invest more time in the project.
After completely rewriting the first version, this time using Typescript and React. Now, Designer Tools provides tools like rulers, guides, and alignment markers directly in the browser, making pixel-perfect design adjustments easier during development.
In addition to layout tools, Designer Tools includes accessibility features that highlight potential accessibility issues, helping teams create more inclusive interfaces. It also supports brand and offers design-related tips to enhance creative workflows.
Since its release, Designer Tools has grown steadily and now helps over 80,000 designers and developers every week improve their interfaces by simplifying workflows, reducing guesswork, and fostering better collaboration between design and development teams.