Skip to content

Releases: MigoXLab/coderio

CodeRio v1.0.3

12 Feb 08:20
3949c4a

Choose a tag to compare

[1.0.3] - 2026-02-12

Added

🐳 Docker Support

Added comprehensive Docker containerization support, enabling users to run CodeRio in isolated, portable environments without local Node.js installation.

What it solves:

  • Environment consistency: Eliminates Node.js version conflicts and dependency issues across different development machines
  • Zero local setup: No need to install Node.js, pnpm, or manage global packages
  • Cross-platform compatibility: Provides consistent experience on Linux, macOS, and Windows (via WSL2)
  • Isolated execution: Runs in containerized environment without polluting host system

Key benefits:

  • ✅ Quick start with pre-built Docker images
  • ✅ Guaranteed environment reproducibility
  • ✅ Simplified CI/CD integration
  • ✅ Easy distribution and deployment
  • ✅ Native support for Windows users through WSL2

What's included:

  • Official Docker image with all dependencies pre-installed
  • Comprehensive Docker documentation with step-by-step setup guide
  • Volume mounting for seamless file access between host and container
  • Network host mode for local development server access
  • Complete workflow support (code generation, validation, and auto-refinement)

Enhanced

🤖 Code Generation Quality

Improved output format validation for multi-file generation.

Fixed

🔧 Checkpoint System Improvements

Fixed issues in the checkpoint management system and improved workspace cleanup logic.

CodeRio v1.0.0

04 Feb 12:29
2d7a4ab

Choose a tag to compare

v1.0.0 - Initial Public Release

🎉 We are excited to announce the first major release of CodeRio!

CodeRio is an intelligent Design-to-Code automation tool that transforms designs into production-ready React code with high visual fidelity. Unlike traditional converters, CodeRio employs a multi-agent system that validates visual accuracy and iteratively refines misalignments to ensure pixel-perfect results.

✨ Key Features

🤖 Intelligent Design-to-Code

  • Multi-Agent Architecture: Autonomous agents collaborate to handle layout analysis, code generation, and refinement.
  • Modern Tech Stack: Generates clean, maintainable code using React, TypeScript, and Tailwind CSS.
  • Scientific Layouts: Prioritizes Flexbox/Grid over absolute positioning for robust responsiveness.

👁️ Visual Validation & Auto-Correction

  • Pixel-Perfect Accuracy: Built-in computer vision capabilities measure element positioning and visual fidelity.
  • Interactive Reports: Generates detailed HTML reports with heatmaps, overlays, and component-level accuracy metrics.
  • Self-Healing Loop: Automatically detects discrepancies and refines the code to match the original design.

🛠️ Robust Developer Workflow

  • Powerful CLI: Full suite of commands (d2c, d2p, val) for flexible integration.
  • Checkpoint & Resume: State preservation allows you to recover gracefully from network interruptions.
  • Skill Mode: Seamless integration as a "Skill" for AI coding assistants like Cursor.

🚀 Usage

CodeRio offers two powerful ways to integrate into your workflow:

Mode 1: CLI (Command Line Interface)

Best for automated pipelines and one-click generation.

# 1. Install globally
npm install -g coderio

# 2. Convert Figma design to code (Full Mode with validation)
coderio d2c -s "https://www.figma.com/design/..." --mode full

Mode 2: Agent Skill (Cursor / Claude)

Best for interactive development and granular control within your IDE.

  1. Install Skill: Copy the provided SKILL.md to your Cursor/Agent configuration.
  2. Prompt: Simply ask your AI assistant:

    "Use design-to-code skill to convert this Figma URL: [URL]"

  3. Interact: The agent will guide you step-by-step, allowing for customizations during the process.

🔗 Links


Thank you to all the contributors who helped make this release possible! ❤️