reversa-design-system

To extract design tokens from a legacy CSS project, this Skill reads available style files and theme definitions to pull colors, typography, spacing, radii, shadows, z-index, transitions, and easing into structured markdown documentation.

Yes, you can generate design system documentation from Tailwind, MUI, Chakra, or Mantine theme files. The Skill reconciles multiple configuration sources and optionally corroborates the extracted tokens with project screenshots.

The best way to document a legacy UI color palette and typography is to automatically extract CSS variables and theme configurations, mapping the design primitives into categorized markdown deliverables in your output folder.

Design token extraction primarily requires source style files or theme definitions to function accurately. Screenshots are used optionally to corroborate visual evidence alongside the extracted CSS variables and UI theme definitions.

You can consolidate CSS variables into a unified design token table by running this Skill, which reads your configured output folder from state.json and maps design primitives into palettes, typography, spacing, and a consolidated table.