Popmelt MCP Server logo

Popmelt MCP Server

by avantjohn

A Model-Controlled Programming (MCP) server for Popmelt, a platform that generates dynamic design systems and UI components based on structured Taste Profiles defined in JSON metadata files. It provides a RESTful API and a visual frontend for design system generation and preview.

View on GitHub

Last updated: N/A

What is Popmelt MCP Server?

The Popmelt MCP Server is a backend application designed to generate dynamic design systems and UI components from JSON-based Taste Profiles. It leverages these profiles to create modern CSS outputs, manage design tokens, and handle component variants, all accessible through a RESTful API and a visual frontend.

How to use Popmelt MCP Server?

To use the Popmelt MCP Server, first clone the repository, install the dependencies using npm install, and start the server with npm start. Access the visual frontend via http://localhost:3000 to browse profiles, generate CSS, and preview components. Utilize the API endpoints to apply talent profiles, generate full design systems, and manage profiles programmatically.

Key features of Popmelt MCP Server

  • Dynamic Profile Processing

  • CSS Generation Engine

  • Design Token System

  • RESTful API

  • Visual Frontend

  • Realtime Preview

  • Component Templates

  • Context Provider

Use cases of Popmelt MCP Server

  • Rapid prototyping of UI components

  • Generating consistent design systems across multiple projects

  • Creating themeable UI libraries

  • Automating the creation of CSS variables and design tokens

FAQ from Popmelt MCP Server

How do I add a new design profile?

Create a new JSON file in the /profiles directory following the specified profile structure. The server will automatically detect and load the new profile.

Can I customize the generated CSS?

Yes, by modifying the JSON profile definitions, you can control the CSS output. The server uses these profiles to generate CSS variables and styles.

How do I deploy this server to production?

You can deploy the server to any Node.js hosting platform, such as Heroku, AWS, or Google Cloud. Ensure that the PORT environment variable is set correctly.

What are the available API endpoints?

The server provides endpoints for applying talent profiles, generating full design systems, generating component CSS, retrieving available profiles, and managing profiles (CRUD operations). See the API Endpoints section in the README for details.

How can I contribute to the project?

Fork the repository, create a feature branch, commit your changes, push to the branch, and open a Pull Request. Contributions are welcome!