Shadcn.io is not affiliated with official shadcn/ui
get_preview_url
Build live preview and public page URLs for any registry item. Four variants — docs page, isolated iframe, dark mode, and macOS-framed screenshot.
get_preview_url is how the agent shows a block instead of describing it. Give it a slug, get back four URLs: the public docs page, an isolated iframe preview, a dark-mode variant, and a screenshot-ready macOS-framed variant.
When to use it
- The user wants to eyeball a block before installing ("show me hero-announcement first").
- A vision-capable agent wants to feed the preview into its pipeline to compare candidates visually.
- Returning links in chat so the user can open them in the browser.
- Generating screenshots — the
?framed=1variant is exactly what our internal screenshot scripts use.
Arguments
| Name | Type | Required | Notes |
|---|---|---|---|
name | string | ✓ | Registry slug |
Example prompts
use shadcnio get_preview_url for hero-announcement and share the link with meuse shadcnio get_preview_url for pricing-grouped-comparison-table — I want to see it in dark modeuse shadcnio to give me preview URLs for the 6 @related alternatives of hero-gradient-headlineResponse shape
{
"name": "pricing-grouped-comparison-table",
"page": "https://www.shadcn.io/blocks/pricing-grouped-comparison-table",
"preview": "https://www.shadcn.io/preview/blocks/pricing/pricing-grouped-comparison-table",
"previewDark": "https://www.shadcn.io/preview/blocks/pricing/pricing-grouped-comparison-table?theme=dark",
"previewFramed": "https://www.shadcn.io/preview/blocks/pricing/pricing-grouped-comparison-table?framed=1"
}page— the docs/marketing page (flat URL, safe fallback).preview— the isolated iframe preview, ideal for vision pipelines.previewDark— same iframe with?theme=dark.previewFramed— same iframe wrapped in a macOS browser frame for screenshots.
Manual invocation
curl -s -X POST "https://www.shadcn.io/api/mcp?token=YOUR_TOKEN" \
-H "content-type: application/json" \
-H "accept: application/json, text/event-stream" \
-d '{"jsonrpc":"2.0","id":1,"method":"tools/call","params":{"name":"get_preview_url","arguments":{"name":"pricing-grouped-comparison-table"}}}' \
| sed -n 's/^data: //p' | jq '.result.content[0].text | fromjson'FAQ
Was this page helpful?
Sign in to leave feedback.
get_item_source
Full registry JSON including the actual TSX source for every file. The heaviest MCP tool by token cost — call it only after the agent has committed.
get_install_command
Build a ready-to-run `shadcn add` command for any registry item, with your token pre-embedded in the URL. The zero-config install handoff.