A tiny Chrome extension that makes debugging layouts less of a pain. You can use this to visualize exactly how much space each element on a page takes up (also works on pseudo-elements ::before
and ::after
).
Chrome without an outline
Chrome with an outline
- Clone this repo:
git clone https://github.com/ctcuff/outlined.git
. - Go to chrome://extensions/ (make sure developer mode is enabled), click
Load unpacked
, and select thesrc
directory.