Model Context Protocol

Your AI agent, now with
a product reference library

Connect GetG to Claude or Cursor and ask your agent anything about real product flows — research patterns, pull HTML and design tokens, recreate any screen without leaving your editor.

What you can do

Research any UX pattern

Ask how real products handle onboarding, feedback, empty states, or settings — without knowing which tool has what.

Pull real design tokens

Get actual colors, fonts, spacing, and HTML from any recorded flow — feed it straight into your design system or Tailwind config.

Recreate any screen accurately

Your agent sees real screenshots and HTML — not descriptions. The output matches what you're actually building against.

Try asking your agent

You don't need to know which tool has what. Just describe what you're looking for — the agent finds real flows, pulls screenshots and HTML, and helps you research or build.

Discover a pattern

“How do modern B2B tools handle user onboarding? Show me 3 different approaches and compare what makes each one feel smooth or frustrating.”

Research for design

“I'm designing a feedback collection feature. Find me real examples of how different products ask for feedback in-context — screenshots and layout breakdowns.”

Benchmark a flow

“We're redesigning our settings page. Show me how 2–3 well-designed SaaS tools structure their settings — what patterns keep coming up?”

Explore interaction feel

“I want our empty states to feel encouraging, not dead. Find examples of empty states that actually guide users forward and get me the HTML for the best one.”

How to invoke the tools

Claude Desktop

Type /getg in any conversation. Claude will prompt you for a search query, then automatically chain search → steps → screenshot → HTML.

Example/getg find the ChatGPT input component

Cursor

Open a chat with Ctrl+L and type your request naturally — works in both Chat and Agent mode. You can also prefix with use the getg tools to... to be explicit.

ExampleFind the ChatGPT new message input and get its HTML

Claude Code

Just describe what you want. Claude Code runs in agentic mode by default and will call search_flows, get_flow_steps, and the rest as needed — no special prefix required.

ExampleGet the Figma empty state screen and recreate it in React

Configuration

Open ~/Library/Application Support/Claude/claude_desktop_config.json and add the getg entry. Restart Claude Desktop after saving.

claude_desktop_config.json

{
  "mcpServers": {
    "getg": {
      "command": "npx",
      "args": [
        "-y",
        "mcp-remote",
        "https://app.thegetg.com/api/mcp"
      ]
    }
  }
}

Uses mcp-remote to bridge the HTTP server to the Desktop client (no install needed — npx handles it).

Available tools

search_flows

Search for recorded UI flows by natural language. Returns up to 8 results with tool name, description, tags, and thumbnail.

querystringe.g. "notion workspace picker" or "onboarding dark mode"

get_flow_steps

Get per-step metadata — clicked element text, tooltip title, duration, patch size. Use to identify which step index matches a specific UI moment.

recordingIdstringRecording ID from search_flows

get_step_screenshot

Returns a base64 PNG screenshot of any step. Vision-capable clients render it inline so the agent sees the exact screen before writing code.

recordingIdstringRecording ID

stepIndexnumberZero-based step index (default 0)

get_trimmed_html

Self-contained HTML snapshot of a step — tree-shaken CSS, no external deps. Use this to recreate the exact screen in your codebase.

recordingIdstringRecording ID

stepIndexnumberZero-based step index (default 0)

get_design_tokens

Full design token set — colors, fonts, spacing, shadows, gradients, border radius, and semantic color roles (primary, surface, error).

recordingIdstringRecording ID

get_flow_skeleton

Compact step-by-step goal + action list (~500 tokens). Good for a quick orientation before fetching HTML or screenshots.

recordingIdstringRecording ID

Your AI agent, now witha product reference library

What you can do

Try asking your agent

How to invoke the tools

Configuration

Buy us a coffee ☕

Your AI agent, now with
a product reference library