Designesy

Designesy

Enables AI agents to score live URLs against a 40-check design contract, validate DTCG tokens and Lottie animations, audit accessibility, and retrieve design-system contracts, catalogs, and review rubrics.

Category
访问服务器

README

Designesy

<picture> <source media="(prefers-reduced-motion: reduce)" srcset="apps/site/public/hero-score-gate.png"> <img src="apps/site/public/hero-score-gate.gif" alt="Designesy Score Gate — a URL flows in, the 40-check contract grid fires, the score counts up to 99.2% grade A, and the gate passes" width="1280"> </picture>

designesy.org — design-system contract verification, scoring, and review tools for AI agents.

Designesy Contract Check is a GitHub Action that scores any URL against a 40-check design-system contract — tokens, motion, accessibility, cadence, takt, poise, identity, interaction, performance, responsive, semantic, security, spec, copywriting — and fails your CI workflow when the score or grade drops below your threshold. No LLM, no heuristics, no vibe-tax: every check is deterministic, reproducible, and grounded in a published contract.

- uses: LE-VAI/designesy-org@v1
  with:
    url: https://your-app.vercel.app
    min-score: 70
    min-grade: B
    post-comment: true   # posts a summary comment on PRs (default)

The same 40-check engine powers an MCP server (11 tools for AI agents), a zero-dependency CLI (npx designesy-score), and a live leaderboard at designesy.org/leaderboard.

Install

# Add to Claude Desktop, Cursor, or any MCP-compatible client:
claude mcp add designesy --transport http https://www.designesy.org/api/mcp

No authentication required — all 11 tools are read-only. The server runs on Vercel as a stateless Streamable HTTP endpoint.

Tools

  • designesy_score — Score a live URL against the 40-check design contract. Returns score, grade (A–F), and per-check breakdown.
  • designesy_tokens_score — Validate a DTCG design-token file. 10 conformance checks against W3C DTCG 2025.10.
  • designesy_a11y_score — Get the WCAG 2.2 AA accessibility framework and Playwright/axe-core script template.
  • designesy_motion_score — Validate a Lottie animation file. 10 checks against Lottie spec v1.0.1 and §16 motion standards.
  • designesy_contract — Get the design-system contract (tokens, motion, takt, cadence, typography, verification).
  • designesy_catalog — List the 12 published Designesy packages with versions and URLs.
  • designesy_design_review — Get the 8-dimension qualitative design review rubric.
  • designesy_skill_md — Get the contract as an agent-skill-format SKILL.md for Cursor, Claude Code, or Replit.
  • designesy_agent_json — Get the /.well-known/agent.json discovery document.
  • designesy_llms_txt — Get the short /llms.txt agent brief.
  • designesy_llms_full_txt — Get the full /llms-full.txt agent brief with paste-ready prompt.

Tool reference table

Tool Description
designesy_score Score a live URL against the 40-check design contract — returns score, grade (A–F), per-check breakdown
designesy_tokens_score Validate a DTCG design-token file (10 conformance checks, W3C DTCG 2025.10)
designesy_a11y_score Get the WCAG 2.2 AA accessibility framework + Playwright/axe-core script template
designesy_motion_score Validate a Lottie animation file (10 checks, Lottie spec v1.0.1 + §16 motion standards)
designesy_contract Get the design-system contract (tokens, motion, takt, cadence, typography, verification)
designesy_catalog List the 12 published Designesy packages with versions and URLs
designesy_design_review Get the 8-dimension qualitative design review rubric
designesy_skill_md Get the contract as an agent-skill-format SKILL.md (for Cursor/Claude Code/Replit)
designesy_agent_json Get the /.well-known/agent.json discovery document
designesy_llms_txt Get the short /llms.txt agent brief
designesy_llms_full_txt Get the full /llms-full.txt agent brief with paste-ready prompt

Live

Contract verification

Designesy Score

The live site is verified against the design system contract — 40 deterministic checks with provenance back to tokens. Current score: 99.2% (Grade A) — 35 passed, 0 failed, 1 warn, 4 skipped (browser-only checks). See the methodology page for how the score is computed.

Contract v0.4.0

  • 40 verification checks across 14 weighted categories — tokens, motion, accessibility, cadence, takt, poise, identity, interaction, performance, responsive, semantic, security, spec, copywriting
  • Copywriting principles (v0.4.0) — 16 UX copy principles + 4 verification checks (button verb phrases, no trailing periods, descriptive link text, no ALL CAPS)
  • 10 Non-Negotiable Motion Standards — deliberate easing, explicit properties, opacity entrances, keyboard stillness, no layout animation, touch gating, bounded duration, reduced-motion paths, asymmetric press, no ease-in
  • 10 acoustic cues — custom $type: sound (net-new vs W3C DTCG 2025.10), Cuelume v0.1.0 engine, interaction-only
  • 9 open tensions — documented, not hidden
  • Spring physics — default + momentum tokens via custom $type: spring
  • Machine-readable — W3C DTCG 2025.10 format + custom extensions

See the contract page for the full adoption history.

GitHub Action

Gate your CI on design-contract compliance:

- uses: LE-VAI/designesy-org@v1
  with:
    url: https://your-app.vercel.app
    min-score: 70
    min-grade: C
    post-comment: true   # posts a summary comment on PRs (default)

Scores a URL via the live /api/score engine and fails the workflow if the score or grade drops below your threshold. Runs on node24, posts PR comments via bare GitHub REST API (zero dependencies). See action/README.md for full usage.

CLI

Score a URL from the command line — for local development, pre-commit hooks, or scripts:

# Local (no install needed):
node cli/designesy-score.mjs designesy.org

# With gating (exit 1 on failure):
node cli/designesy-score.mjs linear.app --min-score 70 --min-grade B

# JSON output for piping:
node cli/designesy-score.mjs vercel.com --format canonical --json

# Via npm script:
npm run score -- designesy.org

Zero dependencies — Node built-ins only. The --api flag or SCORE_API env var overrides the scoring engine URL (defaults to https://www.designesy.org). See --help for all options.

Repository

This is the controlled public root for Designesy — a Next.js 15 App Router site (React 19, Turbopack, Vercel deploy).

apps/site          Next.js application
action/            designesy/contract-check GitHub Action
cli/               designesy-score CLI
docs/designesy     context, architecture, logs, registries
DESIGN.md          the design contract (human-readable)
AGENTS.md          agent operating rules

What Designesy is not

Designesy is not a template gallery. Designesy is not a generic AI design tool. Designesy is not a moodboard.

Designesy is a system.

FAQ

Does it need an API key? No — all 11 tools are read-only. The MCP endpoint is stateless Streamable HTTP with no authentication.

Is it deterministic? Yes. There is no LLM in the scoring loop — every check is deterministic and reproducible. The same URL will always produce the same score.

What does it score against? The Designesy v0.4.0 design-system contract — 40 checks across 14 weighted categories (tokens, motion, accessibility, cadence, takt, poise, identity, interaction, performance, responsive, semantic, security, spec, copywriting).

Can I use it in CI? Yes. The GitHub Action gates your workflow on contract compliance — fail the build if the score drops below your threshold.

Where is the contract published? At designesy.org/contracts/design-system (human-readable) and designesy.org/contracts/design-system.json (machine-readable, W3C DTCG 2025.10).

License

All rights reserved. The contract is public; the code is not open-source. See designesy.org for usage terms.

推荐服务器

Baidu Map

Baidu Map

百度地图核心API现已全面兼容MCP协议,是国内首家兼容MCP协议的地图服务商。

官方
精选
JavaScript
Playwright MCP Server

Playwright MCP Server

一个模型上下文协议服务器,它使大型语言模型能够通过结构化的可访问性快照与网页进行交互,而无需视觉模型或屏幕截图。

官方
精选
TypeScript
Magic Component Platform (MCP)

Magic Component Platform (MCP)

一个由人工智能驱动的工具,可以从自然语言描述生成现代化的用户界面组件,并与流行的集成开发环境(IDE)集成,从而简化用户界面开发流程。

官方
精选
本地
TypeScript
Audiense Insights MCP Server

Audiense Insights MCP Server

通过模型上下文协议启用与 Audiense Insights 账户的交互,从而促进营销洞察和受众数据的提取和分析,包括人口统计信息、行为和影响者互动。

官方
精选
本地
TypeScript
VeyraX

VeyraX

一个单一的 MCP 工具,连接你所有喜爱的工具:Gmail、日历以及其他 40 多个工具。

官方
精选
本地
graphlit-mcp-server

graphlit-mcp-server

模型上下文协议 (MCP) 服务器实现了 MCP 客户端与 Graphlit 服务之间的集成。 除了网络爬取之外,还可以将任何内容(从 Slack 到 Gmail 再到播客订阅源)导入到 Graphlit 项目中,然后从 MCP 客户端检索相关内容。

官方
精选
TypeScript
Kagi MCP Server

Kagi MCP Server

一个 MCP 服务器,集成了 Kagi 搜索功能和 Claude AI,使 Claude 能够在回答需要最新信息的问题时执行实时网络搜索。

官方
精选
Python
e2b-mcp-server

e2b-mcp-server

使用 MCP 通过 e2b 运行代码。

官方
精选
Neon MCP Server

Neon MCP Server

用于与 Neon 管理 API 和数据库交互的 MCP 服务器

官方
精选
Exa MCP Server

Exa MCP Server

模型上下文协议(MCP)服务器允许像 Claude 这样的 AI 助手使用 Exa AI 搜索 API 进行网络搜索。这种设置允许 AI 模型以安全和受控的方式获取实时的网络信息。

官方
精选