ReactFrame

io.github.AhmetLocaPublished by GitHub account AhmetLocav0.2.1Updated Nov 10, 2026

Search ReactFrame's React + Tailwind + Motion components, install free ones and price premium picks.

VerifiedSTDIODesktop onlyWeb Search & ScrapingDeveloper Tools

Overview

AI-generated overview

Lets a coding agent search ReactFrame's React, Tailwind and Motion component catalog, install free components' source, and price premium picks.

What you can do
  • Search the component catalog by keyword with category, type and free-only filters, and list categories with counts.
  • Fetch a free component's full source, files, npm dependencies and install command in shadcn registry format.
  • Retrieve ready-made rebuild prompts for free components that ship one.
  • Price a whole build in one call: install commands for free items, prices for premium ones, the premium total, and whether All-Access is cheaper.
When to use it
Useful when building React sites or landing pages with Tailwind and Motion and you want the agent to pull real component source instead of writing UI from scratch, and to see what premium components would cost before committing.
Requirements
Runs locally over stdio, typically launched with npx from the reactframe-mcp npm package, so Node.js and network access to reactframe.com are needed. No authentication, environment variables or headers are declared; REACTFRAME_BASE_URL can point it at a local instance.
Before you install
Premium component source is not fetchable, so the agent leaves placeholders and quotes prices instead; buying anything happens outside this server. Free component installs write files and add npm dependencies to your project, so review what it adds. The server contacts reactframe.com for catalog data.

Installation

In SourceWeft

  1. Open ReactFrame in the dashboard and add it to a workspace.
  2. Enable the server for the chats that should use its tools.

Desktop only via STDIO. STDIO servers start a local process, so they need the SourceWeft desktop host.

Other MCP clients

Follow the launch instructions in the repository.

README

reactframe-mcp

An MCP (Model Context Protocol) server for ReactFrame — search and pull the full source of free React + Tailwind CSS + Motion components, blocks and pages directly into a coding agent, with no browser round-trip.

It wraps the same public data as reactframe.com/llms.txt and the r/<slug>.json registry mirror shadcn's CLI already uses. Free components install straight into your project. Premium components show up in search with their price; their source isn't fetchable from here, so the agent leaves a placeholder and prices them with get_quote instead.

Build a site with it

Ask your agent something like "Build me a landing page for my coffee shop with ReactFrame components." It picks components from the catalog, installs the free ones, marks where premium ones go, and ends with a quote: which premium components the design uses, what they cost, and whether All-Access is the better deal.

Tools

  • search_components — keyword search across name/description/category/slug, with category, type (element / block / component / page) and freeOnly filters. Premium results include their price.
  • get_component — fetch a free component's full source (files, npm deps, install command) in shadcn registry format, by slug.
  • get_rebuild_prompt — fetch the ready-made "rebuild this from scratch" AI prompt for the free components that ship one.
  • list_categories — list every category with component/page counts, useful before a targeted search.
  • get_quote — price every component and page a build uses in one call: free items with their install command, premium ones with their price, the premium total, and whether All-Access is cheaper.

Add it to Claude Code

bash
claude mcp add reactframe -- npx -y reactframe-mcp

Add it to Cursor / other MCP clients

Add to your MCP config (e.g. ~/.cursor/mcp.json):

json
{  "mcpServers": {    "reactframe": {      "command": "npx",      "args": ["-y", "reactframe-mcp"]    }  }}

Local development

bash
npm installnpm run buildREACTFRAME_BASE_URL=http://localhost:3000 npm run test:tools

REACTFRAME_BASE_URL overrides the default https://reactframe.com — point it at a local npm run dev of the main app while iterating. npm run test:tools spawns the built server over stdio with the real MCP SDK client and calls every tool, the same way a real client would.

Source: mcp-server/README.md at commit c09009e

Tools

0
SourceWeft has not started this package in its sandbox yet, so its tools are not known.

Version history

1
  1. v0.2.1LatestSep 26, 2026

Score

50% of the applicable checks met

How complete this listing is, computed from the registry entry, the endpoint and public sources. Not a rating of the server and not a statement that it is safe or working today: reachability is a dated check, and no installs or reviews go into the score.

  • Reached in the last 30 days25 pts

    Keep the endpoint answering the MCP handshake; SourceWeft probes it every 30 days.

  • Auth declared10 pts

    Declare the credential headers in the registry entry, or keep the endpoint answering the probe so its auth can be classified.

  • Tools listed15 pts

    Answer tools/list without a credential, or ship a package that starts in a sandbox without one.

  • DescriptionRequired15 pts
  • Logo10 pts
  • Documentation15 pts
  • License10 pts