Home/Developer Portal
DEVELOPER PORTAL & PUBLIC API

Build with Flourish UI
programmatically.

A public REST API, OpenAPI 3.1.0 specification, WebMCP browser agent tool surface, and machine-readable shadcn registry. No API keys required, zero rate-limit hurdles, and full CORS enabled out of the box.

50COMPONENTS
0AUTH KEYS
3.1OPENAPI
MCPREADY
QUICKSTART EXAMPLES

Connect in any language or agent runtime.

cURL
bash
# 1. List components with category filter
curl -s "https://flourish-ui.vercel.app/api/components?category=Interactive%20Surfaces"

# 2. Get single component install commands & dependencies
curl -s "https://flourish-ui.vercel.app/api/components/letters-from-the-garden"

# 3. Download raw TypeScript component source
curl -s "https://flourish-ui.vercel.app/api/components/letters-from-the-garden/source"
TypeScript / JavaScript Fetch
ts
// Fetch components programmatically
const res = await fetch("https://flourish-ui.vercel.app/api/components");
const { components, total } = await res.json();

console.log(`Found ${total} components!`);
console.log(components[0].title, components[0].installCommand);
WebMCP / Browser AI Agent
modelContext
// AI agents call in-page tools via WebMCP standard:
const mc = document.modelContext || navigator.modelContext;

// Agent tool invocation:
const results = await mc.callTool("search_components", {
  query: "letters garden",
  category: "Interactive Surfaces"
});
shadcn CLI Direct Install
cli
# Add any Flourish UI component straight into components/flourish/
pnpm dlx shadcn@latest add https://flourish-ui.vercel.app/r/letters-from-the-garden.json

# Or using npx, bunx, or yarn dlx
npx shadcn@latest add https://flourish-ui.vercel.app/r/sequel-frontier-footer.json
LIVE EXPLORER

Interactive API Sandbox.

Test live queries against the Flourish UI REST API in real time.

INTERACTIVE API SANDBOX
GEThttps://flourish-ui.vercel.app/api/components?limit=3

Fetch list of components with pagination and filtering

REST API REFERENCE

Available Public Endpoints.

All endpoints return JSON (or raw TypeScript text for source code) with full CORS permissions.

MethodRouteDescriptionLive Sample
GET/api/componentsList all 50 components with optional filters: ?category, ?search, ?tag, ?limit, ?offset.Try
GET/api/components/{slug}Fetch full metadata, dependencies, and install commands for a specific component.Try
GET/api/components/{slug}/sourceFetch raw TypeScript/React source code for direct injection or inspection.Try
GET/api/categoriesList all 6 component design categories with descriptions and item counts.Try
GET/openapi.jsonOfficial machine-readable OpenAPI 3.1.0 specification describing all endpoints and schemas.Try
GET/r/{slug}.jsonMachine-readable shadcn registry item specification consumed by `shadcn add`.Try
GET/pricing.mdStructured machine-readable pricing specification declaring $0 MIT licensing for AI agents.Try
GET/llms-full.txtComplete single-file knowledge bundle indexing all 50 components and install commands.Try
GET/okf/index.mdOpen Knowledge Format (OKF) index mapping conceptual documentation for AI systems.Try
AI AGENT INTEROPERABILITY

WebMCP in-page tools for browser agents.

Flourish UI implements the WebMCP standard for autonomous browser agents (such as ChatGPT browser, Claude, and Chrome Origin Trial agents). Tools are registered dynamically via document.modelContext.registerTool() and declarative server-rendered forms.

search_components tool
get_component metadata tool
get_component_source code tool
list_categories taxonomy tool
WebMCP Spec Summary

Primary registration: document.modelContext.registerTool()

Fallback registration: navigator.modelContext.registerTool()

Declarative forms: <form toolname="..." tooldescription="...">

OpenAPI Endpoint: /openapi.json

LLM Agent Manifest: /llms.txt

Full Knowledge Bundle: /llms-full.txt

Agent Pricing Spec: /pricing.md

Open Knowledge Format: /okf/index.md

FREQUENTLY ASKED QUESTIONS

Everything you need to know.

Direct, concise answers to common questions about Flourish UI, licensing, and integration.

What is Flourish UI?

Flourish UI is a free, open-source collection of 50+ expressive React and Next.js components featuring WebGL shaders, tactile skeuomorphism, and physics-driven micro-interactions. All components provide direct TypeScript source code and one-command installation via the shadcn CLI registry.

How do I install Flourish UI components?

You can install any Flourish UI component using the shadcn CLI by running pnpm dlx shadcn@latest add https://flourish-ui.vercel.app/r/[component-slug].json. Alternatively, developers can copy raw TypeScript code directly from the component page or retrieve it via the public REST API.

Is Flourish UI free for commercial use?

Yes, Flourish UI is 100% free and open-source under the MIT License. You can freely use, modify, customize, and distribute all components in personal, commercial, client, and open-source projects with zero licensing fees or attribution requirements.

What machine-readable files does Flourish UI provide for AI agents?

Flourish UI provides /llms.txt, /llms-full.txt, /pricing.md, an OpenAPI 3.1.0 specification at /openapi.json, a Google Open Knowledge Format (OKF) bundle at /okf/index.md, and in-page WebMCP agent tools via document.modelContext.

OPEN ECOSYSTEM

Ready to build something distinctive?
Explore the components.

Explore library