OpenAI releases CodeDesign: LLM fine-tuned to generate design tokens and components

AI · 5 min read

OpenAI's new CodeDesign model is trained on paired datasets of design files and production components to better translate Figma frames and Sketch artboards into code-ready tokens and component templates. The model supports outputs in React, SwiftUI, and Jetpack Compose, and can produce normalized token files with semantic naming to reduce ambiguity.

CodeDesign emphasizes traceability: outputs include a mapping between visual elements and token names, plus suggested variant names for states like hover or disabled. The model can also generate scaffolding for component tests and accessibility annotations, which aims to reduce time required for design-to-dev handoffs.

OpenAI is offering CodeDesign as a hosted API and as a smaller on-prem container for enterprise customers worried about IP leakage. Early trials with engineering teams reported a 30–40% reduction in time spent translating visual designs into components when combined with a CI step that validates token adherence.