Styling Addon: configure styles and themes in StorybookAutomate with Chromatic
Storybook Day 2023
Back to integrations
Add your integration
  • ⭐️ Popular
  • 🧩 Essentials
  • 🛠 Code
  • ⚡️ Data & state
  • ✅ Test
  • 💅 Style
  • 🎨 Design
  • ⚙️ Appearance
  • 🗄 Organize
How to install addons Create an addon
XSpecs Storybook integration addon
npm install @xspecs/storybook-addon
Last updated about 3 years ago
Downloads per week
Readme View on GitHub

XSpecs storybook addon

To get started

  1. Install the addon by:
yarn add @xspecs/storybook-addon --dev
  1. Add the addon package to storybook main.js config file:
module.exports = {
  stories: ['...'],
  addons: ['...', '@xspecs/storybook-addon'],
  1. Configure the XSpecs app url and login page by appending this to the preview.js storybook config file:
// This is the XSpecs addon configuration
  xspecs: {
    appUrl: "",


After installing the addon you will find an XSpecs panel on the bottom of the rendered story view in the storybook. You'll need to login to your JIRA and show any view with XSpecs specs on it.

Then for each story you'll be able to find and add specs for your stories. They will be shared for all of the storybook users.

Contact us

Join the community
6,055 developers and counting
WhyWhy StorybookComponent-driven UI
Open source software

Maintained by
Special thanks to Netlify and CircleCI