Skip to content

chromaui/storybook-addon-outline

main
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

⚠️ MOVED: This addon was moved to the Storybook monorepo

Storybook Addon Outline (moved)

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.

React Storybook Screenshot

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.

About

A storybook addon for visually debugging CSS layout and alignment

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •