/
Browse all pages

Hover to inspect

The box model in DevTools' colours on any element you hover, with each band's size.

Inspect is Nitpique's main tool, and the one it starts in. Hovering an element draws its box model in the same colours as browser DevTools: margin, border, padding and content, with the size of each band written in it. A label shows the element's tag, id, classes and size.

  1. Turn Nitpique on.
  2. Move the pointer over the page. Press 1 if another tool is active.
  3. Read the sizes in the bands and the label.

Questions

Does the hover box model match DevTools?

Yes. It draws margin, border, padding and content in the same colours as browser DevTools, with each band's size written in it.

What does the label show?

The element's tag, id, classes and size.

Hovering does nothing. What do I press?

Press 1 to go back to Inspect if another tool is active.