Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add CallMeMing/claude-skills-ming --skill design-lintergit clone --depth 1 https://github.com/CallMeMing/claude-skills-mingWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/callmeming/claude-skills-ming/design-linter)<a href="https://agentmods.dev/skills/callmeming/claude-skills-ming/design-linter"><img src="https://agentmods.dev/badge/skills/callmeming/claude-skills-ming/design-linter/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/callmeming/claude-skills-ming/design-linter"><img src="https://agentmods.dev/badge/skills/callmeming/claude-skills-ming/design-linter.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00125 | $0.04525 |
| Opus 5 | $0.00063 | $0.02263 |
| Sonnet 5 | $0.00025 | $0.00905 |
| Haiku 4.5 | $0.00013 | $0.00453 |
Grade A, and why
design-linter scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 11d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 389 lines — stays where its author put it; the contents beside it link to each section on GitHub.
🌐 Language Policy (i18n)
Language Detection: Detect the language of the user's input.
Response Consistency: Always respond in the same language as the user's input (e.g., if the user asks in English, output the report and suggestions in English; if in Chinese, use Chinese).
Core Logic: The internal rules and design specs (like spacing, colors) remain the same regardless of the language.
For English Users: When generating violation reports and fix suggestions, translate the "violation description" and "fix suggestion" into English. Keep the code snippets as-is.
设计规范走查器技能
技能概述
自动检测生成的代码是否违反design-system.md中的规范,确保代码符合设计系统要求。提供详细的违规报告和修复建议。
核心功能
- 规范解析 - 解析design-system.md中的设计规范
- 代码分析 - 分析生成的代码是否符合规范
- 违规检测 - 检测违反规范的代码模式
- 修复建议 - 提供具体的修复建议和正确示例
- 报告生成 - 生成详细的规范检查报告
设计系统规范摘要
技术栈要求
- 框架: React + TypeScript
- 样式: Tailwind CSS v4 (CSS-first 配置)
- 组件库: Radix UI + shadcn/ui
- 设计系统: 基于 CSS 变量的自定义设计令牌系统 (tokens.css + globals.css)
强制规范约束
1. 间距约束
- 纵向文字间距: ≥ 8px (对应
gap-spacing-te-sm或mt-spacing-te-sm) - 横向元素间距: ≥ 4px (对应
gap-spacing-te-xs) - 禁止: 生成如
mt-[2px]、gap-[3px]的非标代码 - 正确: 使用 spacing-te token:
spacing-te-xs(4px)、spacing-te-sm(8px)、spacing-te-l(12px)、spacing-te-md(16px)、spacing-te-lg(24px)
2. 字体语义类
- 禁止: 在组件内使用
text-[xxpx]、text-xs、text-sm、text-lg等非语义类 - 必须: 统一调用预设的语义类:
text-te-xs(10px)、text-te-sm(11px)、text-te-base(13px)、text-te-md(14px 默认)、text-te-lg(16px)、text-te-xl(20px)、text-te-2xl(24px) - 目标: 确保排版节奏一致性和可维护性
3. Icon着色协议
- 要求: 当 Icon 与文字同行出现时,必须显式为 Icon 指定语义颜色变量
- 禁止: 使用浏览器默认黑色或硬编码颜色值
- 正确: 使用
text-current继承父级颜色,或显式指定text-primary、text-muted-foreground等 - 注意: 使用
size-4而非w-4 h-4语法
4. 内容区Padding分级
- 三级规范:
spacing-te-l: 12px (紧凑间距)spacing-te-md: 16px (默认,标准间距)spacing-te-lg: 24px (大间距)
- 禁止: 随意指定数值如
p-[14px]或px-[18px] - 正确: 使用
p-spacing-te-l、p-spacing-te-md、p-spacing-te-lg,或组合如px-spacing-te-lg
What ships with it
3 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 11d ago First seen · 389 lines · 125 tokens per session scan A 7c4537d06481
design-linter is a skill published in the GitHub repository CallMeMing/claude-skills-ming (1 stars, last pushed 4mo ago), licensed MIT. It adds 125 tokens to every session and 4,525 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
baoyu-diagram
Create professional, dark-themed SVG diagrams of any type — architecture diagrams, flowcharts, sequence diagrams, structural diagrams, mind maps, timelines, illustrative/conceptual diagrams, and more. Use this skill whenever the user asks for any kind of technical or conceptual diagram, visualization of a system…
accessibility
Audit and improve web accessibility following WCAG 2.2 guidelines. Use when asked to "improve accessibility", "a11y audit", "WCAG compliance", "screen reader support", "keyboard navigation", or "make accessible".
understand-figma
Analyze a Figma file via the Figma REST API and generate an interactive design knowledge graph (pages, screens, components, component sets, instances, design tokens) with a kind:"design" dashboard.
sxo
Search Experience Optimization (SXO) — the bridge between SEO and UX/CRO. Audits the full journey from the SERP click to the on-page goal: SERP click-through factors (title/meta/rich results that win the click), then post-click experience signals that keep users and drive conversions — above-the-fold relevance and…
create-workflow-diagram
Create FigJam/Miro-style workflow diagrams as high-quality PNG images from plain-text workflow descriptions. Renders beautiful HTML diagrams with connected nodes, arrows, and labels, then screenshots them for sharing.
create-chatgpt-mockup
Render pixel-accurate ChatGPT mobile (iOS) screen mockups in light mode from a thread JSON. Supports user text bubbles, user image attachments, assistant markdown prose, citation chips, the OpenAI spiral logo, the Apps-SDK GPT chip in the composer, and three header styles (model-tag, plain title, "Get Plus"). Fixed…