codexplugin
F

Figma

Official

by OpenAI

Plugindesign8.9K stars

Design-to-code workflows powered by the Figma integration

Install now

$ npx codex-marketplace add openai/plugins/plugins/figma --plugin

About

Design-to-code workflows powered by the Figma integration

Figma is a codex plugin that extends OpenAI Codex with design capabilities. After install, Codex can use Figma context and actions during your coding sessions without leaving the conversation.

Source package path: openai/plugins/plugins/figma on GitHub (openai/plugins).

Key features

  • Official extension maintained for current Codex APIs
  • Adds Figma capabilities directly inside Codex chat
  • Installs with one npx command — no manual config editing
  • Built for design workflows

How to install

  1. 01

    Copy the install command

    Use the command on this page — it includes the correct --plugin flag for this plugin.

  2. 02

    Run it in your project terminal

    Execute the command from the directory where you use Codex, not necessarily your home folder.

  3. 03

    Restart or reload Codex

    Restart the Codex CLI or reload your IDE window so the new extension is picked up.

  4. 04

    Try an example prompt

    Ask Codex something related to Figma to confirm the plugin is active.

Example prompts

Try these after installing to confirm Figma is working.

> Pull design specs from the selected Figma frame
> Compare this component to the Figma design and list gaps
> Generate React markup matching the Figma layout

Requirements

  • Node.js 18 or newer with npx available
  • Codex CLI or IDE extension installed and signed in
  • Some official plugins open OAuth in your browser on first use
Back to all plugins

More from OpenAI

Other plugins by the same author

Related plugins

More in design