davidyeiser / storybook-react-with-dark-mode

Dark Mode setup for Storybook and React components.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Storybook React with Dark Mode Integration

This is a companion repository for a tutorial on how to set up Storybook React with dark mode integration. It uses the storybook-dark-mode addon to toggle dark mode on and off for Storybook and connects the React components to the control with the addon’s useDarkMode React hook.

Animated image showing the Storybook user interface and the React component in the main preview window toggling dark mode on and off.

Install

From the project’s root directory, run:

yarn

This installs React, Storybook, the storybook-dark-mode addon, Emotion and the rest of the project dependencies.

Run

yarn storybook

This will load Storybook at http://localhost:9001.

About

Dark Mode setup for Storybook and React components.


Languages

Language:JavaScript 100.0%