@storybook/addon-measure
TypeScript icon, indicating that this package has built-in type declarations

8.1.9 • Public • Published

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:

export default {
  addons: ['@storybook/addon-measure'],
};

Inspiration

Package Sidebar

Install

npm i @storybook/addon-measure

Weekly Downloads

4,720,103

Version

8.1.9

License

MIT

Unpacked Size

32.4 kB

Total Files

11

Last publish

Collaborators

  • domyen
  • kasperpeulen
  • valentinpalkovic
  • jreinhold
  • kylegach
  • ndelangen
  • shilman
  • tmeasday
  • ghengeveld
  • winkervsbecks
  • yannbf