OpenAI releases 'CodeCraft' model tuned for design-to-code fidelity

Tech · 6 min read

OpenAI releases 'CodeCraft' model tuned for design-to-code fidelity

OpenAI's CodeCraft is a specialized model trained on paired datasets of design files and corresponding front-end implementations. The aim is to improve fidelity when converting Figma and Sketch layouts into React, Vue, or plain HTML/CSS, preserving spacing, responsive behavior, and accessible markup.

The release includes a CLI and IDE plugin that compares generated code against design constraints and highlights mismatches. CodeCraft also outputs component tests and accessibility audits alongside the code, enabling developers to validate the translation before committing.

While CodeCraft significantly reduces boilerplate work, teams caution that manual review remains necessary, particularly for complex interactions and performance considerations. OpenAI published best-practice guidelines and sample pipelines for integrating the model into CI systems.