Layro

io.github.Uvxxsh由 GitHub 帳號 Uvxxsh 發布v1.0.2更新於 Oct 24, 2026

Search and install 112 production React, TypeScript and Tailwind CSS UI components from Layro.

發布方自己的服務:Layro

已驗證Streamable HTTP可網頁執行知識與記憶開發者工具

概覽

AI 產生的概覽

Layro React 與 Tailwind 元件庫的遠端 MCP 伺服器,讓助理搜尋元件、讀取屬性與原始碼並取得安裝步驟

可以做什麼
搜尋 Layro 元件目錄並列出分類,回傳每個元件與範本的存取等級與版本。讀取單一元件的詳細資料:屬性、變體、npm 相依套件、安裝的檔案、版面行為以及搭配使用的元件。取得完整元件原始碼及其匯入的檔案,或取得安裝步驟,包括 shadcn 登錄設定與 CLI 指令。檢查呼叫方是否有權取得某個元件或範本。讀取主題的色彩權杖與改樣式說明,並取得組合多個元件的完整可執行配方檔案。
適用情境
適合在建置 React、Next.js 或 Tailwind 介面時使用,讓助理找到合適的 Layro 元件、檢視其 API 與原始碼,並以正確的安裝指令接入,而不是靠猜測。
執行需求
透過 streamable HTTP 連線 layropro.com 的遠端端點,需寫入 MCP 用戶端設定。搜尋與元件詳細資料無需帳號。安裝元件需要在 Authorization 標頭中攜帶來自 Layro 帳戶頁面的 Bearer CLI 權杖;免費帳號權杖可取得免費元件,終身存取可取得 Pro 元件。需要網路存取。
安裝前請注意
Authorization 標頭攜帶機密 CLI 權杖,請勿放入共用設定或程式碼儲存庫。Pro 元件安裝依賴付費的終身存取權限,且當連線帶有 CLI 權杖時,get_installation 可能產生短期安裝權杖。原始碼與安裝輸出會被寫入專案,提交前請檢查產生的檔案。

安裝

在 SourceWeft 中

  1. 開啟 儀表板中的 Layro,將其新增到工作區。
  2. 為需要使用其工具的對話啟用該服務。

Web executable,透過 Streamable HTTP。 遠端服務在工作區中設定後即可從網頁執行環境執行。

交給代理程式安裝

把這段提示詞貼上到 Claude Code、Codex、Cursor 等代理程式,或 SourceWeft 對話中。代理程式會讀取該伺服器的安裝指南,先向你展示發布者、端點和登入方式,經你同意後再把它新增到你的客戶端。金鑰不會寫進任何命令。

閱讀 https://sourceweft.com/mcp/io.github.Uvxxsh%2Flayro/install.md,並按其中說明把這個 MCP 伺服器接入我的客戶端。修改任何設定之前,先告訴我它的發布者、端點和登入方式,等我確認。不要把 API 金鑰寫進命令或我會提交的檔案;問我金鑰應從哪裡取得。

檢視代理程式所依據的安裝指南

其他 MCP 客戶端

把它新增到你客戶端的 mcpServers 設定中。

{
  "mcpServers": {
    "layro": {
      "type": "http",
      "url": "https://layropro.com/api/mcp"
    }
  }
}

README

Layro MCP

Layro is a library of 112 production React UI components written in TypeScript and styled with Tailwind CSS (62 free). Its remote MCP server gives Cursor, Claude Code, VS Code, Windsurf, Codex and other MCP clients access to the whole library. Your agent can search the library, read each component's props and usage, and install the tested component with pinned packages.

Install

Add to ~/.cursor/mcp.json (or .cursor/mcp.json in a project):

json
{  "mcpServers": {    "layro": { "url": "https://layropro.com/api/mcp" }  }}

Search and component details work with no account. To install components, add the CLI token from https://layropro.com/account. A free account's token unlocks the 62 free components; lifetime access unlocks Pro:

json
{  "mcpServers": {    "layro": {      "url": "https://layropro.com/api/mcp",      "headers": { "Authorization": "Bearer YOUR_LAYRO_TOKEN" }    }  }}

Docs: https://layropro.com/mcp

來源:README.md,提交 757bc2f

工具

10

search_components

Search Layro components

Find Layro React + Tailwind components by what they do. Returns the best matches first with slug, category, access (free or pro) and version. Start here, then call get_component for details.

輸入參數limitquery必填category

get_component

Get a Layro component

Everything about one component except its source: when to use it, props, variants, npm dependencies, the files it installs, a typechecked usage example with real props, how it sizes and scrolls (layout), the components it pairs with and the recipes it appears in.

輸入參數slug必填

get_component_code

Get a Layro component's code

The complete source for one component and every file it imports, ready to save at the paths given. Free components need a free Layro account's token; Pro components need the caller's Layro lifetime access. Install with the shadcn CLI instead when you can run commands (see get_installation).

輸入參數slug必填include_dependencies

get_installation

Install Layro components

Installation for one or more components: the one-time @layro registry setup for components.json, the shadcn CLI command (always @layro/<slug>, never a bare URL), a ready-to-run agent command with a 15-minute install token when this connection carries a CLI token, the npm packages still missing (pass installed_packages from package.json), the files and where they go, and the theme setup.

輸入參數modeslugs必填package_managerinstalled_packages

list_categories

List Layro categories

The categories in the Layro catalogue with the components in each, plus the library contract: stack, theme, access, install path, and the accessibility and responsive behaviour every component has.

無需輸入參數。

search_templates

Search Layro templates

Find complete Layro React / Next.js templates: what each is, its stack, a live preview and how it is licensed.

輸入參數limitquery

get_template

Get a Layro template

One template's details and whether the caller may download it. Never returns the template's files.

輸入參數slug必填

check_access

Check Layro access

Whether the caller can take a component or template, and why: free, subscriber, lifetime, purchased or unauthorized.

輸入參數slug必填

get_theme

Get the Layro theme

The theme's colour tokens (light and dark values, and what each one colours), how to restyle Layro to a brand from your own CSS without editing components, the type scale, and the cn() config for it.

無需輸入參數。

get_recipe

Get a Layro recipe

Complete, runnable files that combine several Layro components the way they fit together: an AI chat app shell (Sidebar + Conversation History + AI Chat, with a phone drawer), a dashboard app and a billing page. Without a slug, lists the recipes. Every recipe typechecks against the components.

輸入參數slug

版本歷史

2
  1. v1.0.2最新Oct 16, 2026
  2. v1.0.1Oct 15, 2026

評分

已滿足適用檢查項的 90%

該評分衡量此收錄條目的完整程度,依據註冊中心條目、端點與公開來源計算得出。它不是對伺服器本身的評價,也不表示伺服器安全或目前可用:可連通性是帶日期的檢查結果,評分也不包含安裝量或使用者評價。

  • 近 30 天內可連通必需25 分
  • 已宣告認證方式必需10 分
  • 已列出工具必需15 分
  • 描述必需15 分
  • 圖示10 分
  • 文件15 分
  • 授權條款10 分

    請在儲存庫或註冊中心條目中宣告授權條款。

其他 Layro 整合