# design-parity-review-agent

Checks coded user interfaces against Figma designs and reference screenshots. Catches typography drift, missing tokens, and spacing errors early.

- subagent · `type=agent` · Codex, ChatGPT · ★ 7604
- Author: Figma · official OpenAI repository
- License: LicenseRef-Figma-Developer-Terms · policy=link-only · description only; the file stays with the author
- Source: https://github.com/openai/plugins/tree/HEAD/plugins/figma/agents/design-parity-review-agent.md
- Updated: 2026-10-08
- HTML: https://affpapa.org/en/nevibecode/agents/design-parity-review-agent

## What it does

This subagent compares implemented frontend interfaces directly with Figma specifications. Visual defects and broken component interactions take precedence over general code formatting rules. The agent identifies wrong design tokens, shifted margins, substituted graphic assets, and typography drift.

Review output follows a fixed three-part structure: issues ordered by severity, missing context or blockers, and an overall parity summary. Without visual references or screenshots, the agent will not guess and requests the necessary context before continuing.

## Requirements
- Works with: Figma

## Install

### Codex (native platform)

**Manually: put the files in place**
- File: `.codex/agents/design-parity-review-agent.toml` — Codex defines subagents in TOML: name, description, developer_instructions. Move the Markdown text into developer_instructions by hand. For all projects use ~/.codex/agents/

### Claude Code

**Manually: put the files in place**
- File: `.claude/agents/design-parity-review-agent.md` — For all projects use ~/.claude/agents/. Claude delegates by the description field or an @-mention

### Cursor

**Manually: put the files in place**
- File: `.cursor/agents/design-parity-review-agent.md` — Cursor also reads .claude/agents/

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/openai/plugins/tree/HEAD/plugins/figma/agents/design-parity-review-agent.md

## When to use it
- spot typography and spacing drift between code and mockups
- detect misused design tokens in interface styles
- catch substituted visual assets or missing icons
- generate parity findings sorted by severity

## Example prompts
- Compare this modal dialog against the Figma screenshot and check margins
- Review the implemented profile card against the design file for token mismatches

## Similar
- [ui-ux-designer](https://affpapa.org/en/nevibecode/agents/ui-ux-designer.md) — subagent · 27069 installs
- [ui-designer](https://affpapa.org/en/nevibecode/agents/voltagent-community-ui-designer.md) — subagent · 1979 installs
- [ui-designer](https://affpapa.org/en/nevibecode/agents/ui-designer.md) — subagent · 1979 installs
- [mobile-app-developer](https://affpapa.org/en/nevibecode/agents/mobile-app-developer.md) — subagent · 1552 installs
- [ux-researcher](https://affpapa.org/en/nevibecode/agents/ux-researcher.md) — subagent · 703 installs
- [accessibility-tester](https://affpapa.org/en/nevibecode/agents/accessibility-tester.md) — subagent · 346 installs

From the same set: [openai/plugins](https://affpapa.org/en/nevibecode/by/openai/plugins.md) — 596 cards

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md