lizikk c07f07cae8 vault: auto-sync 2026-03-07 02:00

2026-03-07 02:00:02 +08:00

2.0 KiB

Raw Permalink Blame History

title: Impeccable: Design skills for AI coding tools slug: impeccable-design-skills status: inbox content_type: reference source_url: https://impeccable.style/ collected_at: 2026-03-06 tags: [ai-tools, design, frontend, skills]

Impeccable: Design skills for AI coding tools

概述

基于 Anthropic 原版 frontend-design skill 的增强版，提供：

1 个技能 — 深度设计专业知识
17 个命令 — 设计语言的核心词汇
反模式库 — 排版/颜色/布局/动画的避坑指南

支持工具：Cursor、Claude Code、Gemini CLI、Codex CLI

安装方式（Claude Code）

方式 1：Plugin Marketplace

/plugin marketplace add pbakaus/impeccable
/plugin menu  # 选择安装

方式 2：手动下载

下载 ZIP 解压到项目根目录（与 package.json 同级）
创建 .claude/ 隐藏文件夹

方式 3：全局安装

解压到 ~/.claude/ 目录
项目级安装优先级更高，可版本控制

命令使用

所有命令以 /i- 为前缀避免冲突：

例如：/i-audit、/i-polish 等
安装后可查看命令速查表

故障排查

问题	解决方案
命令不出现	输入 `/` 检查是否有 `/i-*` 命令；确认文件位置正确
技能不生效	明确提示 "use the frontend-design skill" 强制激活
新手入门	先熟悉基础 AI 工具操作，再使用此技能

工具特定设置

Cursor

Switch to Nightly channel in Settings → Beta
Enable Agent Skills in Settings → Rules

Gemini CLI

Install preview: npm i -g @google/gemini-cli@preview
Run /settings and enable "Skills"
Run /skills list to verify

作者

Pascal Bakaus (@pbakaus)

专注：AI 转型咨询、开发者体验、设计系统、全栈架构

评估

这个工具可以作为 frontend-design skill 的增强补充，适合需要高质量 UI 输出的场景。

2.0 KiB Raw Permalink Blame History Unescape Escape