Inspecting sizes of fonts in CSS

Want to know the font-size of a particular element on your web page? Look no further.

Drop this script in, and you are good to go. Just click on the element and you will be alerted with its font size.

  <script>
    window.addEventListener(‘click’, function (evt) {
      if (evt && evt.target && evt.target.getAttribute(‘data-font-size’)) {
        alert(evt.target.getAttribute(‘data-font-size’));
      }
    });
    Array.prototype.forEach.call(document.querySelectorAll(‘*’), function (el) {
      el.setAttribute(
        ‘data-font-size’,
        window.getComputedStyle(el).getPropertyValue(‘font-size’)
      );
    });
  </script>