Skip to content

Latest commit

 

History

History
 
 

measure

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Storybook Addon Measure

Storybook addon for inspecting layouts and visualizing the box model.

  1. Press the m key to enable the addon:

  2. Hover over a DOM node

  3. Storybook will display the dimensions of the selected element—margin, padding, border, width and height—in pixels.

Usage

This addon requires Storybook 6.3 or later. Measure is part of essentials and so is installed in all new Storybooks by default. If you need to add it to your Storybook, you can run:

npm i -D @storybook/addon-measure

Add "@storybook/addon-measure" to the addons array in your .storybook/main.js:

module.exports = {
  addons: ['@storybook/addon-measure'],
};

Inspiration