Find, read and install shadcn components with Salesforce Lightning's look, for Radix and Base UI.
Maintain this server? Claim it
Call this server's tools from your browser. Nothing to install.
Requests go through mcptry because browsers can't call most MCP servers directly. Header values are sent to the server for that request only and are never stored or logged.
Tool list from our last check. Connect live to refresh it.
Read one Wisty UI item: its install command, its examples by name, When to use, When not to use, Usage, Rules, its API reference for the project's base, then its longer docs sections. Pass style from components.json so the API matches the project. An agent that already knows the item can ask for only some sections, like ["Rules"] or ["API reference"]. With source: true it adds the installable files, which you rarely need: install with the shadcn command instead.
The item's name, like "lookup", as search_components and list_components give it.
The "style" field of the project's components.json, like "radix-nova" or "base-nova". It picks the Radix or Base UI version. Leave it out for the Radix version.
Add the item's installable files, for reading or copying by hand.
Only these parts, under the item's title and install command. Leave it out for all of them.
Pick your client. Values in capitals, like YOUR_TOKEN, are yours to fill in.
Run in a terminal
claude mcp add --transport http ui https://ui.wisty.ai/mcp
Read one Wisty UI item: its install command, its examples by name, When to use, When not to use, Usage, Rules, its API reference for the project's base, then its longer docs sections. Pass style from components.json so the API matches the project. An agent that already knows the item can ask for only some sections, like ["Rules"] or ["API reference"]. With source: true it adds the installable files, which you rarely need: install with the shadcn command instead.
| Argument | Type | Description |
|---|---|---|
| name* | string | The item's name, like "lookup", as search_components and list_components give it. |
| style | string | The "style" field of the project's components.json, like "radix-nova" or "base-nova". It picks the Radix or Base UI version. Leave it out for the Radix version. |
| source | boolean | Add the item's installable files, for reading or copying by hand. |
| sections | array | Only these parts, under the item's title and install command. Leave it out for all of them. |
{
"type": "object",
"required": [
"name"
],
"properties": {
"name": {
"type": "string",
"maxLength": 100,
"minLength": 1,
"description": "The item's name, like \"lookup\", as search_components and list_components give it."
},
"style": {
"type": "string",
"description": "The \"style\" field of the project's components.json, like \"radix-nova\" or \"base-nova\". It picks the Radix or Base UI version. Leave it out for the Radix version."
},
"source": {
"type": "boolean",
"default": false,
"description": "Add the item's installable files, for reading or copying by hand."
},
"sections": {
"type": "array",
"items": {
"enum": [
"When to use",
"When not to use",
"Usage",
"SLDS mapping",
"Keyboard interactions",
"Accessibility",
"Motion",
"Responsive behavior",
"Performance",
"Rules",
"Examples",
"API reference"
],
"type": "string"
},
"description": "Only these parts, under the item's title and install command. Leave it out for all of them."
}
},
"additionalProperties": false
}Get the code of one example of a Wisty UI item, for the project's base: a complete, working use you can adapt. Without example, the first one, which shows the job the item is for. A page block's first example is the files its install writes, the page first; any other example that imports its item's own files, like its sample data, is followed by them. get_component lists each item's examples by name.
| Argument | Type | Description |
|---|---|---|
| name* | string | The item's name, like "lookup", as search_components and list_components give it. |
| style | string | The "style" field of the project's components.json, like "radix-nova" or "base-nova". It picks the Radix or Base UI version. Leave it out for the Radix version. |
| example | string | The example's name, like "default". |
{
"type": "object",
"required": [
"name"
],
"properties": {
"name": {
"type": "string",
"maxLength": 100,
"minLength": 1,
"description": "The item's name, like \"lookup\", as search_components and list_components give it."
},
"style": {
"type": "string",
"description": "The \"style\" field of the project's components.json, like \"radix-nova\" or \"base-nova\". It picks the Radix or Base UI version. Leave it out for the Radix version."
},
"example": {
"type": "string",
"maxLength": 100,
"minLength": 1,
"description": "The example's name, like \"default\"."
}
},
"additionalProperties": false
}Get the steps to install one Wisty UI item with the shadcn CLI: the npx shadcn command, the theme step that writes Wisty UI's theme into the project's stylesheet once, and, for an item that draws Salesforce icons, the step that copies their sprites to the app's static files. Read style and tailwind.css from the project's components.json, and whether the project has a src/ folder, first; a project without one runs npx shadcn@latest init before anything else.
| Argument | Type | Description |
|---|---|---|
| name* | string | The item's name, like "lookup", as search_components and list_components give it. |
| style* | string | The "style" field of the project's components.json, like "radix-nova" or "base-nova". It picks the Radix or Base UI version. |
| srcDir | boolean | Whether the project has a src/ folder, where the shadcn CLI puts the theme files. Without it, a tailwindCss under src/ is taken to mean one. |
| themed | boolean | True when the stylesheet already has Wisty UI's theme: --color-page in its @theme inline, or an import of tokens.css. Leaves the theme step out. |
| tailwindCss | string | The "tailwind.css" path from components.json, like "src/index.css", relative to the project. It gives the exact lines for importing the theme by hand; without it, the steps name the files to import instead. |
List every Wisty UI item by kind, with its name and first sentence, optionally only one kind. Primitives are shadcn's own components with the Salesforce look; components are what shadcn lacks, like lookup; blocks are Salesforce assemblies over sample data; helpers turn records into a block's props. Prefer search_components when you know the job.
| Argument | Type | Description |
|---|---|---|
| kind | string | Only items of this kind. |
{
"type": "object",
"properties": {
"kind": {
"enum": [
"primitive",
"component",
"block",
"helper"
],
"type": "string",
"description": "Only items of this kind."
}
},
"additionalProperties": false
}Find Wisty UI components by the job they do, ranked best first. Use one to three short keywords, like "record picker", "picklist", "toast" or "confirm delete", not a sentence. Each match gives the item's name, kind (primitive, component, block, helper), its description and, when its docs hold the query's words, the line of its When to use or When not to use that does. Read a match with get_component.
| Argument | Type | Description |
|---|---|---|
| kind | string | Only items of this kind. |
| limit | integer | The most matches to return. |
| query* | string | One to three keywords for the job. |
{
"type": "object",
"required": [
"query"
],
"properties": {
"kind": {
"enum": [
"primitive",
"component",
"block",
"helper"
],
"type": "string",
"description": "Only items of this kind."
},
"limit": {
"type": "integer",
"default": 8,
"maximum": 20,
"minimum": 1,
"description": "The most matches to return."
},
"query": {
"type": "string",
"maxLength": 100,
"minLength": 1,
"description": "One to three keywords for the job."
}
},
"additionalProperties": false
}We read every tool's name, description and inputs the way the model will, looking for instructions hidden from you. A clean result means no warning signs, not a guarantee. Scanned Nov 5, 2026.
{
"type": "object",
"required": [
"name",
"style"
],
"properties": {
"name": {
"type": "string",
"maxLength": 100,
"minLength": 1,
"description": "The item's name, like \"lookup\", as search_components and list_components give it."
},
"style": {
"type": "string",
"description": "The \"style\" field of the project's components.json, like \"radix-nova\" or \"base-nova\". It picks the Radix or Base UI version."
},
"srcDir": {
"type": "boolean",
"description": "Whether the project has a src/ folder, where the shadcn CLI puts the theme files. Without it, a tailwindCss under src/ is taken to mean one."
},
"themed": {
"type": "boolean",
"description": "True when the stylesheet already has Wisty UI's theme: --color-page in its @theme inline, or an import of tokens.css. Leaves the theme step out."
},
"tailwindCss": {
"type": "string",
"maxLength": 200,
"minLength": 1,
"description": "The \"tailwind.css\" path from components.json, like \"src/index.css\", relative to the project. It gives the exact lines for importing the theme by hand; without it, the steps name the files to import instead."
}
},
"additionalProperties": false
}