ckm:design-system

Generate design tokens for Tailwind using a three-layer architecture that transforms primitive definitions into semantic and component-level CSS variables. This system outputs validated CSS variables and Tailwind integration guidance to prevent hardcoded styles in your frontend components.

A three-layer design token architecture maps primitive values to semantic tokens and then to component-specific overrides. This structure enables scalable theming and per-component customization while maintaining consistent UI styling across design-to-code handoffs.

Generate brand-compliant HTML slides by feeding token JSON or CSS assets into a slide generation system driven by CSV layout logic. The system applies your design tokens, integrates Chart.js, and selects curated backgrounds to produce investor and marketing decks.

You can validate CSS variables and detect hardcoded styles using provided token validation scripts. These scripts scan your code and HTML assets to identify non-compliant values, ensuring your UI adheres to the generated design token definitions.

You need decision CSV files to drive the slide generation layout logic. These CSVs define the structural decisions for your presentation, allowing the system to map design tokens and Chart.js visualizations into a structured investor or marketing deck.