How to use the same color variable in both Storybook palette and component?
<p>I created a UI component library and used Storybook to provide documentation and examples for it. </p>
<p>My goal is to declare a color palette in the SCSS file and use it in the component and storybook palette. </p>
<p>Storybook Palette is a built-in storybook component that can create documentation for your color palette. </p>
<p>So, I expect that if the colors of the design system change, I can just change the SCSS variable value and both the color palette and the component will be updated with the new color value. </p>
<p>Unfortunately, the storybook documentation is poor in this section, and the examples only contain hardcoded colors. The color palette page is an MDX file, so I don't know how to import and use SCSS variables there. </p>
<p>Is there a way to achieve my goal? </p>