Opens in a new tab

Brixies MCP is here! Find layouts with your AI assistant. Learn more

Claude Code

Add Brixies MCP to Claude Code and check that the connection works.

Before you start

Make sure you have:

  • Claude Code installed and working on your computer.
  • Node.js 22 or later and a working npx command.
  • A Brixies account with an active annual plan or lifetime access (LTD).
  • An active Brixies API key.

See Requirements if you still need to prepare your computer, or Get your API key to generate your key.

Brixies MCP runs locally on your computer and connects to your Brixies account over the internet.

Copy your configuration

  1. Open Account → API key.
  2. Find Connect your assistant. If the section is collapsed, click Show setup.
  3. Select Claude Code.
  4. Choose Paste config.
  5. Click Copy configuration.

The configuration includes the package command and the Brixies API URL. Your key is represented by the placeholder YOUR_BRIXIES_API_KEY.

Select Claude Code, choose Paste config and click Copy configuration.

Add Brixies to your project

  1. Open the local project folder you use with Claude Code.
  2. Create a file named .mcp.json in the project root, or open it if it already exists.
  3. Add the Brixies configuration:
    • If the file is new or empty, paste the configuration you copied.
    • If it already contains MCP servers, add the brixies entry inside the existing mcpServers object. Preserve the other entries and settings.
  4. Replace YOUR_BRIXIES_API_KEY with your actual key, keeping the surrounding quotation marks.
  5. Save the file.

Find the configuration file

The .mcp.json file belongs in your project’s main folder, not inside a .claude folder.

On macOS:

  1. Open your project folder in Finder.
  2. Press Cmd + Shift + . (period) to show hidden files.
  3. Find .mcp.json and open it in a text editor.

Press the same shortcut again to hide hidden files.

On Windows:

  1. Open your project folder in File Explorer.
  2. Find .mcp.json and open it in a text editor.
  3. If hidden items are enabled for this file, turn on View → Show → Hidden items in Windows 11, or View → Hidden items in Windows 10.

If the file does not exist, create a plain-text file named .mcp.json in the project’s main folder. Make sure it is not saved as .mcp.json.txt.

Keep your key private. Do not commit .mcp.json to a Git repository or share it while it contains your API key.

This configuration applies to this project. Open Claude Code in the same project folder when using Brixies.

Need help editing the file?

You can use Copy a prompt in the Brixies setup section to ask Claude Code to prepare the configuration.

Review the proposed changes and let it leave YOUR_BRIXIES_API_KEY as a placeholder. Then enter your real key directly in the local file.

Do not paste your API key into the chat.

Restart Claude Code

Close your current Claude Code session and start a new one in the same project folder.

If prompted, review and approve the Brixies project MCP server.

The first launch may take a little longer while npx downloads the Brixies MCP package. You do not need an npm account or a manual installation of index.js.

Check the server

Inside Claude Code, enter:

/mcp

Find brixies and review its connection status.

If it reports a connection problem, resolve it before continuing with the test.

Test your connection

Send this prompt:

Use only the connected Brixies MCP tools to retrieve my account preferences and tell me which framework is currently selected. Only mention the ACSS version if it applies.

Do not open a browser, control my computer, sign in to the website, or make direct API requests outside the MCP tools. Do not ask me to paste my API key into the chat. Do not generate a page.

If the Brixies MCP tools are unavailable or the request fails, stop and explain the connection issue. Do not use another method or rely on previous conversation history.

If Claude Code asks for permission to use a Brixies MCP tool, review and approve that tool request.

The connection is working when Claude Code retrieves your preferences through a Brixies MCP tool and reports your selected framework.

This test only needs Brixies MCP tools. Decline browser or computer-control requests. Approving a Brixies MCP tool is fine.

A reply based only on earlier conversation history does not verify the connection.

If the connection does not work

ProblemWhat to check
Brixies is missing from /mcpCheck that .mcp.json is in the project root and that you opened Claude Code in that project.
The server needs approvalReview and approve the Brixies project server when prompted.
There is a configuration errorCheck the JSON syntax, including quotation marks, commas and braces.
The MCP process cannot startCheck that Node.js 22 or later is installed and that npx --version works in your terminal.
Your key is rejectedMake sure you replaced the placeholder with your current active key. If you regenerated it, update the configuration.
Brixies reports a membership issueCheck your plan in Account → Billing.

If you need support, share the error message with your API key and personal information removed.

You’re connected

You can now ask Claude Code to search the Brixies library and help you choose layouts.

To start with the copy-link workflow, try:

Example prompt

Find Brixies layouts for a dental clinic landing page using my framework preference. Include a hero, services, testimonials and a contact section. Show me your proposed selection before generating a copy link.

How to update Brixies MCP

On this page

Type at least 2 characters to search.