Tape allows creating a custom grid to measure distance between all set rules. It snaps to sides of elements (can be turned off) and font baselines, allows setting horizontal and vertical rules manually, generate them automatically and have a custom origin point.
Once a grid rule is placed, it stays in place as the page is scrolled through and browser window manipulated. Items snapped to elements will stay with elements.
DevTools only displays measurements of the HTML element's box that means that it can't measure, for example, relative to text's baseline or objects within a canvas element.
Dimensions takes a screenshot of the page and uses that to create a contour map via edge detection that can then be used to measure actual page elements instead of HTML elements. For example, Dimensions measures against contours of letters in text, through transparent backgrounds, etc
Since Dimensions is based on color edge detection, color gradients and patterns tend to mess with the results. A simple workaround is to open Chrome's DevTools (or equivalent) and remove the offending DOM object.
Add to Chrome
Add to Edge
Add to Firefox
Add to Opera
Add to Brave
Add to Safari