← Back to homepage

Connect your AI assistant

Effect.Labs has an official MCP server. Your AI assistant (Claude, ChatGPT, Cursor…) can search the 840 effects, present them to you and add their code straight into your project.

What your assistant can do

• Find an effect from a description ("a button that ripples on hover", "an aurora background"), a category or a technology.
• Show an effect's details and the link to its live demo.
• Give the full code of the 100+ free effects, no account needed.
• With a Premium subscription: give the full code of every effect in the library.
• Present the plans and send you to the subscription page. Payment always happens on effect-labs.com, by you.

Server address

https://effect-labs.com/api/mcp.php

HTTP transport. Without a key: search, effect details, pricing and free effect code. With your personal key: premium effect code.

Your personal key (Premium subscribers)

Sign in, open the Favorites page, "AI assistants (MCP)" section, and click "Create a key". It is shown only once: copy it right away. You can revoke it at any time from the same page.

Your key is personal: do not share or publish it, for example in a code repository (see Article 6 of the Terms of Sale). In the examples below, replace YOUR_KEY with your key.

Setup

Claude Code

claude mcp add --transport http --scope user effect-labs https://effect-labs.com/api/mcp.php --header "Authorization: Bearer YOUR_KEY"

Without a subscription, simply remove the --header part.

Cursor

In ~/.cursor/mcp.json:

{
  "mcpServers": {
    "effect-labs": {
      "url": "https://effect-labs.com/api/mcp.php",
      "headers": {
        "Authorization": "Bearer YOUR_KEY"
      }
    }
  }
}

Claude Desktop

In claude_desktop_config.json (Settings → Developer → Edit Config), through mcp-remote (Node.js 18 or later):

{
  "mcpServers": {
    "effect-labs": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://effect-labs.com/api/mcp.php",
        "--header",
        "Authorization:${EFFECT_LABS_AUTH}"
      ],
      "env": {
        "EFFECT_LABS_AUTH": "Bearer YOUR_KEY"
      }
    }
  }
}

ChatGPT

In ChatGPT on the web (paid plans), turn on developer mode in the settings, then create an app with the server address and "No authentication". ChatGPT can then search the catalogue, deliver free effect code and present the subscription. Premium code delivery in ChatGPT is not available yet. Menu labels may vary between ChatGPT versions.

Limits

Premium code is limited to 50 different effects per hour and 80 per week, shared with the website. Free effect code is limited to 60 effects per hour from the same connection. Overall, a single connection can make up to 600 requests per hour (searches, effect details and code). Beyond that, your assistant receives a message asking you to try again later.

Frequently asked questions

What is MCP?

The Model Context Protocol is an open standard that lets an AI assistant use external tools. Here it gives your assistant direct, up-to-date access to the Effect.Labs catalogue instead of guessing code.

Do I need a subscription?

No to search, read effect details and get the code of free effects. Yes for premium effect code.

Does Effect.Labs see my conversations?

No. The server only receives the assistant's requests, such as a search or an effect ID, never the rest of your conversation.

What if my key leaks?

Revoke it from the Favorites page and create a new one. The old key stops working immediately.

Not subscribed yet? See the plans.

Last updated: October 2026