Spacing Trace is a Chrome extension designed for developers and designers to visually inspect margins, padding, and gaps on web pages. This tool simplifies the inspection process by eliminating the need to navigate through DevTools, presenting a clear, color-coded layout directly on the web page. Each property is distinctly represented: orange for margins, green for padding, and purple for gaps, with pixel values displayed prominently in the center of the overlays.

The extension features a floating menu that lists pixel values alongside their respective margin, padding, and gap counts, allowing for quick reference. Users can easily highlight specific spacing properties directly from the menu, and the context menu provides options to toggle the extension and adjust overlay visibility. Spacing Trace is particularly beneficial for front-end engineers, UI designers, and QA teams who require accuracy in layout implementation, enhancing workflow efficiency.