mcpField
M
mozaic

mozaic

Local
github.com/MerzoukeMansouriDeveloper Tools
Repository

About mozaic

mozaic is an MCP server and set of agent skills for using ADEO’s Mozaic Design System in coding projects. It gives coding agents access to design references and code generation across several supported UI frameworks.

Key features

  1. 01Query design tokens and components
  2. 02Generate Vue, React, Web Component, and Freemarker code
  3. 03Search icons and documentation
  4. 04Browse CSS utilities and style guides
  5. 05Interactive workflows for eight agent skills

Use cases

  1. 01Generate a Mozaic component for a Vue or React app
  2. 02Look up token values while styling an interface
  3. 03Find an icon or CSS layout utility
  4. 04Review a style-guide pattern before building a screen

MCP support

The MCP server exposes 19 tools for querying Mozaic tokens, components, icons, documentation, utilities, and style guides, and for generating code. Coding agents connect to the local stdio server; a separate HTTP API is also documented.

Configuration

Local server config is the same for every client. Copy it into your client’s MCP config file.

mcp.json · Universal config
{
  "mcpServers": {
    "merzoukemansouri-mozaic": {
      "command": "npx",
      "args": [
        "-y",
        "mozaic-mcp-server"
      ]
    }
  }
}
Run commandnpx -y mozaic-mcp-server

Local servers need a runtime on your machine (e.g. Node.js 18+). Config file locations differ by client; see your client’s docs.

Packages
npmmozaic-mcp-server2.14.3

Tools

19

Saved tool list · updated 2w ago

ParameterTypeRequiredDescription
formatenumNoOutput format: json (structured), scss ($variables), css (--custom-properties), js (constants)json | scss | css | js
categoryenumYesToken category: colors, typography, spacing, shadows, borders, screens, grid, or allcolors | typography | spacing | shadows | borders | screens | grid | all

Details

The maintainer has not added details yet. Check the README in the repository.

Comments

Markdown supported

New to MCP?

From what the protocol is to installing your first server, these answers cover most first questions.

An open protocol that defines how AI applications connect to external tools and data in a uniform way. Clients talk to the model; MCP servers provide tools, resources and prompt templates. They exchange standard messages, so one server can be reused by many clients.