SkillAgentSearch skills...

refero-styles-mcp-server

MCP server that finds and returns design.md specs from styles.refero.design matching your project

Install / Use

claude mcp add faridjafarlee -- npx -y github:faridjafarlee/refero-styles-mcp-server

If the server publishes to npm under a different name, use that package instead — check the repo README.

About this skill
🔌

MCP Server

Model Context Protocol server

Quality Score

63/100

Supported Platforms

Claude Code
Claude Desktop

Our assessment of refero-styles-mcp-server

refero-styles-mcp-server scores 63/100 on our quality scale, 4001st of 4,648 Development & Engineering skills we index.

Its MCP Server is 2.1 KB long, split into 7 sections with 6 code examples: moderately detailed.

It has 3 GitHub stars, so there is little community track record yet; judge it on its content.

Substance
20/30
Structure
18/20
Description
12/15
Adoption
3/20
Freshness
11/15

Maintenance, license and trust

  • The repository was last updated about 6 months ago. That is recent enough to be usable, but agent tooling moves fast, so check the instructions against your agent's current version.
  • No license is declared. By default that means all rights are reserved: you can read it, but reusing or redistributing it is not clearly permitted. Ask the author before building on it commercially.
  • Its trust signals score 73/100, with 3 cautions from licensing, adoption, age or documentation. These come from repository metadata, not a code audit — read the skill file before letting an agent act on it.

Safety scan

No issues found

Our scan of the whole file found no instruction hijacking, hidden characters, credential access, data exfiltration or destructive commands. An AI review of the same text found nothing harmful.

AI review by kimi-k2.7-code on 2026-10-06. Automated pattern scan on 2026-10-06. It catches known dangerous patterns, not every risk — read a skill before letting an agent act on it.

refero-styles-mcp-server compared with similar skills

All 4 of these similar skills score higher than refero-styles-mcp-server; compare them before choosing.

SkillScoreStarsUpdatedFormat
refero-styles-mcp-server (this skill)by faridjafarlee6336mo agoMCP Server
Agent-Reachby Panniantong100105.5k3d agoCLAUDE.md
taste-skillby Leonxlnx100104.3ktodayCLAUDE.md
headroomby headroomlabs-ai10078.1ktodayCLAUDE.md
ai-job-searchby ai-job-search-dev10067.1k1d agoCLAUDE.md

Frequently asked questions

How do I install refero-styles-mcp-server?
Run claude mcp add faridjafarlee -- npx -y github:faridjafarlee/refero-styles-mcp-server. The install tabs above show the steps for each supported agent.
Which AI agents does refero-styles-mcp-server work with?
It is written for Claude Code and Claude Desktop, as a MCP Server file. Other agents that read the same format can often use it too.
Is refero-styles-mcp-server safe to use?
Our scan of the whole file found no instruction hijacking, hidden characters, credential access, data exfiltration or destructive commands. An AI review of the same text found nothing harmful. It declares no license and scores 73/100 on trust signals. Skills are instructions an agent will follow, so read the file before installing it and do not approve commands you do not understand.
Is refero-styles-mcp-server still maintained?
The repository was last updated about 6 months ago. That is recent enough to be usable, but agent tooling moves fast, so check the instructions against your agent's current version.

refero-styles-mcp-server

An MCP server that searches styles.refero.design for design systems that match your project's idea, needs, and style — returning ready-to-use design.md documentation.

Tools

| Tool | Description | |------|-------------| | refero_list_styles | Browse the curated catalog with pagination | | refero_search_styles | Search by keyword, mood, brand, or color | | refero_get_design_md | Fetch the full design.md for a specific style | | refero_match_style | Primary tool — match styles to your project description |

Quick Start

npm install
npm run build
node dist/index.js

Usage with Claude Desktop

Add to ~/Library/Application Support/Claude/claude_desktop_config.json:

{
  "mcpServers": {
    "refero-styles": {
      "command": "node",
      "args": ["/path/to/refero-styles-mcp-server/dist/index.js"]
    }
  }
}

Example Prompts

Find a design style for my dark SaaS dashboard targeting developers.
Match a design.md for a clean fintech mobile app, light theme.
Get the full design.md for Linear's design system.

How It Works

  1. refero_match_style fetches all styles from the Refero API (~60 styles across 3 pages)
  2. Scores each style against your description using mood detection, keyword matching, and color scheme alignment
  3. Returns the top N matches ranked by score with their reasons
  4. Fetches and returns the full design.md for the top match — ready to paste into your AI coding prompt

Project Structure

src/
├── index.ts              # Server entry point
├── constants.ts          # API URLs and limits
├── types.ts              # TypeScript interfaces
├── services/
│   └── referoApi.ts      # API client for styles.refero.design
├── tools/
│   ├── listStyles.ts     # refero_list_styles
│   ├── searchStyles.ts   # refero_search_styles
│   ├── getDesignMd.ts    # refero_get_design_md
│   └── matchStyle.ts     # refero_match_style
└── utils/
    ├── designMd.ts       # Generates design.md from JSON data
    └── errors.ts         # API error handling

Related Skills

View on GitHub
GitHub Stars3
CategoryDevelopment
Updated5mo ago
Forks1

Languages

TypeScript

Trust signals

73/100

From repository metadata: license, adoption, age and documentation. Not a code audit — see the Safety scan above for what the skill file itself contains.

1 medium2 low1 info