Previously, we didn't have a way to visualize the changes in CSS, and JavaScript color tokens. The current storybook renders the Figma token json. So we had to manually ensure that the hex values were the same across all these platforms. This process was prone to errors and inconsistencies.
We need to introduce a visualization of the CSS and JS color tokens along with the Figma token json. Now, we can visually check that any token updates are correctly reflected across all token formats. This will help us maintain consistency and catch any discrepancies early.
Technical Details
Update brand, light theme and dark theme stories to include JS and CSS color tokens
Acceptance Criteria
A visualization of the CSS and JS color tokens along with the Figma token json is available in Storybook
Additional Information
Once the script is created, it should be tested by running it and checking the output JSON file. The JSON file should then be used in a Storybook story to ensure it works as expected.
Description
Previously, we didn't have a way to visualize the changes in CSS, and JavaScript color tokens. The current storybook renders the Figma token json. So we had to manually ensure that the hex values were the same across all these platforms. This process was prone to errors and inconsistencies.
We need to introduce a visualization of the CSS and JS color tokens along with the Figma token json. Now, we can visually check that any token updates are correctly reflected across all token formats. This will help us maintain consistency and catch any discrepancies early.
Technical Details
Acceptance Criteria
Additional Information
Once the script is created, it should be tested by running it and checking the output JSON file. The JSON file should then be used in a Storybook story to ensure it works as expected.