MCP.Market

Flowbite MCP server

by themesberg·io.github.themesberg/flowbite-mcp·v1.1.3·42 stars
No reviews yet

MCP server to convert Figma designs to Flowbite UI components in Tailwind CSS

C68/100grade C
Write a reviewInstall
What users say
No reviews yet
Be the first
Safety scan
C68/100

full report

Adoption
Growing

42 stars

Reviews

Write one

Nobody has reviewed Flowbite yet.

If you have run it, two minutes of your experience saves the next person an afternoon.

Flowbite tools (2)

write = sends, deletes, buys or posts

Read from the package source without running it. The installed server may list more.

  • convert-figma-to-code

    Fetches a Figma node and its rendered image from the Figma API and converts it to a code block. Requires FIGMA_ACCESS_TOKEN environment variable to be set.

  • generate-theme

    Generates a custom Flowbite theme CSS file based on a brand color (hex format) and user instructions. The AI will intelligently analyze the instructions and customize ALL theme variables (border radius, spacing, colors, typography, etc.) to match the desired aesthetic. This tool creates color shades and variations, adapting the entire theme system to match your brand identity.

Public scan report

scanner v0.1.10 · 2026-10-01 · same rubric, same numbers if you re-run it

no findings
  • Code scan3 source files scanned25/25
  • –Live reliabilityno gateway calls yet and no remote to proben/a
  • –Tool poisoningtools not inspected (local package is not executed); not countedn/a
  • Auth qualitystatic API keys via environment variables6/15
  • Maintenancelast push 270 days ago4/15
  • Maintainer identityregistry namespace matches repository owner; GitHub account older than a year9/10
Overall 68/100. Components that don't apply are left out of the denominator. Any critical finding is an F.RubricAppeal a findingJSON

How Flowbite compares

Against every graded Media MCP server, from our own scans and uptime checks. Updated after each scan run.

Safety score
68/100
higher than 32% of 1,337 Media servers
Tools
2
the typical Media server has 7
Tools that change things
0%
typical: 4%. Fewer write tools means less an agent can break
GitHub stars
42
more than 93% of 715 Media servers

What its tools let an agent do: 1 read · 1 create

Install Flowbite in Claude Code, Cursor or VS Code

Runs npx -y flowbite-mcp on your machine. Read the scan report first; the gateway never runs local packages.

claude mcp add flowbite-mcp -- npx -y flowbite-mcp
Add to Cursor

What the publisher says

From the Flowbite repository's README, as published. We do not edit it. Read it on GitHub

Official MCP server for Flowbite to leverage AI for UI creation and theme generation

An MCP server that enables AI assistants to access the Flowbite library of Tailwind CSS components—including UI elements, forms, typography, and plugins—while offering an intelligent theme generator for creating custom branded designs within AI-driven development environments.

MCP Features

Tools:

  • 🎨 [NEW] Figma to code - Copy the Figma node url and generate code (video demo)
  • 🎯 Theme file generator - Create custom branded themes from any branded hex color

Resources:

  • 📦 60+ UI components - Complete access to the Flowbite UI components

Server:

  • 🌐 Dual transport support - Standard I/O (stdio) for CLI or HTTP Streamable for server deployments
  • ⚡ Production ready - Docker support with health checks and monitoring

Quickstart

Using NPX

The simplest way to use Flowbite MCP Server:

npx flowbite-mcp

Environment variables

Currently you only need the Figma personal access token if you want to enable the Figma to code generation tool.

// other options
"env": {
  "FIGMA_ACCESS_TOKEN": "YOUR_PERSONAL_FIGMA_ACCESS_TOKEN"
}

You set this variable in your MCP client configuration file.

Integration examples

Use the following configuration examples to install the Flowbite MCP server in popular clients such as Cursor, Claude, Windsurf, and others.

Claude desktop

Update the claudedesktopconfig.json file and add the following configuration:

{
  "mcpServers": {
    "flowbite": {
      "command": "npx",
      "args": ["-y", "flowbite-mcp"],
      "env": {
        "FIGMA_ACCESS_TOKEN": "YOUR_PERSONAL_FIGMA_ACCESS_TOKEN"
      }
    }
  }
}

Cursor editor

Update the mcp.json file and add the following configuration:

{
  "mcpServers": {
    "flowbite": {
      "command": "npx",
      "args": ["-y", "flowbite-mcp"],
      "env": {
        "FIGMA_ACCESS_TOKEN": "YOUR_PERSONAL_FIGMA_ACCESS_TOKEN"
      }
    }
  }
}

Windsurf editor

Update the mcp_config.json file and add the following configuration:

Shortened. The full README is on GitHub.

Nothing above is checked by us. What we check is on the safety report.

Flowbite: common questions

Is Flowbite MCP server safe?
With care: it is graded C, so read the findings first (68/100). Read the Flowbite safety report
How do I install Flowbite?
It runs on your machine. Copy the Claude Code, Cursor, VS Code or Claude Desktop config from the install section.
Does Flowbite need an API key?
Yes. The registry entry asks for FIGMA_ACCESS_TOKEN.
Is Flowbite maintained?
The last commit was 304 days ago (2026-01-04). The latest release is v1.1.3.
What can I use instead of Flowbite?
Servers from other publishers that do the same job: Mimic AI MCP server, Dembrandt MCP server and Figma MCP Server.
How does Flowbite compare with other Media MCP servers?
safety score 68/100 (higher than 32% of 1,337 Media servers); tools 2 (the typical Media server has 7); tools that change things 0% (typical: 4%. Fewer write tools means less an agent can break). Full comparison.

Alternatives to Flowbite

Same job from other publishers: the closest match first, then the best rated.

  • Mimic AI
    Builds Figma from your design system: real components and tokens, enforced, learning every build.
    More from miapre →
    A
  • Dembrandt
    Design tokens from any live site: colours, type, spacing, components, drift against a baseline.
    B
  • Figma MCP Server
    The Figma MCP server brings Figma design context directly into your AI workflow.
    A
  • melta UI
    AI-Ready design system MCP: melta UI tokens, component contracts, 107 rules, check_html self-verify
    A
  • Figma UI
    Bidirectional Figma MCP — AI draws UI on Figma canvas, reads designs back
    A