Outline
Outline all elements with CSS to help with layout placement and alignment
npx install storybook-addon-outline
383
Downloads per week
Made by Storybook
ReadmeView on GitHub

Storybook Addon Outline
Storybook Addon Outline can be used for visually debugging CSS layout and alignment inside the preview in Storybook. Based on Pesticide, it draws outlines around every single element in the preview pane.
Getting Started
Requires Storybook 6.1 or later. Install the latest with npx sb upgrade --prerelease
First, install the addon
npm i -D storybook-addon-outline
Then, add following content to .storybook/main.js
:
module.exports = {
addons: ['storybook-addon-outline'],
};
Usage
Click on the outline button in the toolbar to toggle the outlines.