## Summary
The official Figma MCP server OAuth flow (mcp.figma.com) consistently fails with "Invalid state parameter" error when
used with Claude Code on macOS. The `state` parameter is corrupted during the OAuth callback redirect — spaces (%20%20)
are inserted into the base64url-encoded value.
## Environment
- Client: Claude Code (CLI) on macOS (Apple Silicon)
- MCP Server: mcp.figma.com/mcp (official Figma MCP)
- Browser: Chrome 146 on macOS
- Figma Plan: Professional (Dev Seat)
## Steps to Reproduce
1. Start Claude Code with the official Figma MCP plugin
2. Trigger OAuth authentication
3. Open the generated authorization URL in Chrome
4. Authorize the application in Figma
5. Figma redirects to http://localhost:<port>/callback
## Expected
OAuth callback succeeds, MCP tools become available.
## Actual
Browser shows: "Authentication Error — Invalid state parameter. Please try again."
## Root Cause
The `state` parameter is corrupted during the redirect:
Original (sent in auth URL):
state=GyQ6xy8wgzJ6BIqifWZqSruPVz1sF8ah1n8YX7Giv0E
Received in callback:
state=GyQ6xy8%20%20wgzJ6BIqifWZqSruPVz1sF8ah1n8YX7Giv0E
^^^^^^^^ two spaces inserted
The localhost callback handler compares the received state with the stored state, finds a mismatch, and rejects the
request.
Reproduced multiple times across:
- Different OAuth sessions (fresh state values each time)
- Different Figma plans (Free → Professional)
- Regular and incognito browser windows
## Workaround
Using a PAT-based MCP server (@tmegit/figma-developer-mcp) for read-only access instead of the official OAuth-based
server.