# livewire-flux-mcp

Fetches up-to-date Livewire Flux component and layout docs for AI assistants. It helps write Blade markup with accurate props while filtering out paid Pro items.

- MCP server · `type=mcp` · Claude Code, Codex, Cursor, GitHub Copilot, Windsurf (Devin Desktop), Cline, Zed, Gemini CLI · ★ 9
- Author: leMaur
- License: MIT · policy=link-only · description only; the file stays with the author
- Source: https://github.com/leMaur/livewire-flux-mcp
- Updated: 2026-10-23
- HTML: https://affpapa.org/en/nevibecode/mcp/livewire-flux-mcp

## What it does

This MCP server pulls structured documentation directly from `fluxui.dev` for specific UI elements, layouts, and Heroicon names. Rather than dumping thousands of tokens from a wide knowledge base, it returns only the targeted component page alongside its property reference. Responses stay cached locally for 24 hours, keeping lookups fast during long coding sessions.

The server checks license tiers on the fly, alerting the model whenever a component requires a paid commercial Flux subscription. It connects over standard input and output via `npx`, so you do not need a global package installation. Running `npx livewire-flux-mcp install` wires the necessary skill files into Laravel projects that already rely on Boost.

## Requirements
- Needs: Node.js (commands run via npx)

## Install

### Claude Code (native platform)

**Platform CLI**
```bash
claude mcp add livewire-flux-mcp -- npx -y livewire-flux-mcp
```

### Codex

**Platform CLI**
```bash
codex mcp add livewire-flux-mcp -- npx -y livewire-flux-mcp
```

### Cursor

**Config file**
File `.cursor/mcp.json`:
```json
{
    "mcpServers": {
        "livewire-flux-mcp": {
            "command": "npx",
            "args": [
                "-y",
                "livewire-flux-mcp"
            ]
        }
    }
}
```

### GitHub Copilot

**Config file**
File `.vscode/mcp.json`:
```json
{
    "servers": {
        "livewire-flux-mcp": {
            "type": "stdio",
            "command": "npx",
            "args": [
                "-y",
                "livewire-flux-mcp"
            ]
        }
    }
}
```

### Gemini CLI

**Platform CLI**
```bash
gemini mcp add livewire-flux-mcp npx -y livewire-flux-mcp
```

## When to use it
- pull live prop references for individual Livewire Flux components
- identify paid Pro UI elements before generating Blade views
- look up Heroicon identifiers compatible with the `flux:icon` tag
- reduce token consumption compared to broad documentation searches

## Example prompts
- Show me the available props and usage for the `flux:modal` component
- Find the right Heroicon name for an edit button using `flux:icon`
- Build a settings form using only free Flux UI elements

## Similar
- [Front-End Checklist](https://affpapa.org/en/nevibecode/mcp/front-end-checklist.md) — MCP server · ★ 74569
- [tldraw](https://affpapa.org/en/nevibecode/mcp/tldraw.md) — MCP server · ★ 51104
- [Figma-Context-MCP](https://affpapa.org/en/nevibecode/mcp/figma-context-mcp.md) — MCP server · ★ 16073
- [mcp-server-chart](https://affpapa.org/en/nevibecode/mcp/mcp-server-chart.md) — MCP server · ★ 4406
- [Dembrandt](https://affpapa.org/en/nevibecode/mcp/dembrandt.md) — MCP server · ★ 3851
- [RevoGrid DataGrid MCP Pro](https://affpapa.org/en/nevibecode/mcp/revogrid-datagrid-mcp-pro.md) — MCP server · ★ 3451

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md