Skip to content

Roadmap

Mirabelle Doiron edited this page Mar 29, 2026 · 1 revision

v1 -- React Web App (complete)

  • React 19 + TypeScript + Vite 6 + Tailwind CSS v4
  • shadcn/ui component library + custom layout primitives
  • Motion scroll and interaction animations with spring physics
  • WCAG 2.1 AA/AAA contrast audit + APCA Lc values
  • Color vision deficiency simulation (4 types)
  • Dark mode, A11y mode, Low Carbon mode
  • Fully accessible: keyboard navigation, screen reader support, reduced motion
  • 15 design tokens per theme, ready-to-use CSS variables
  • Lighthouse: Performance 98, Accessibility 95-96, Best Practices 100, SEO 100

v2 -- Figma Plugin (WIP)

Turn ColorX into a Figma plugin so designers can generate and audit themes without leaving their design tool.

  1. Scaffold Figma plugin project with the Plugin API and a React-based UI
  2. Embed @colorx/core as the generation engine
  3. Generate themes and inject them directly into Figma as local styles or variables
  4. Add a contrast audit panel that flags failing color pairs in the current Figma file
  5. Support syncing generated tokens as Figma variables (color, number) for design token workflows
  6. Publish to the Figma Community

v3 -- GitHub Action

A CI/CD step that validates design tokens against contrast thresholds on every pull request.

  1. Create a GitHub Action that accepts a JSON or CSS file of design token color pairs
  2. Validate each pair against configurable WCAG 2.1 and APCA thresholds
  3. Fail the CI check if any pair drops below the configured minimums
  4. Output a contrast report as a PR comment with pass/fail badges for each pair
  5. Support configuration via a .colorxrc.json file in the repository root
  6. Publish to the GitHub Actions Marketplace

Clone this wiki locally