先看看示例
作者提供的示例，实际效果取决于你的输入和使用工具。
输入
编辑材料：受众是招聘者，现有蓝色标志须保留；有3个作品及各自截图，无公开用户规模数据。原项目为React与普通CSS，只做展示页，已有项目详情链接不能变更。
输出
编辑示例 · 未运行
设计判断：面向招聘者的前端作品集，以清楚浏览项目和职责为主，保留蓝色品牌强调，采用浅色开放布局。
首屏标题“把复杂流程做成可用界面”，正文只说明个人职责，主入口统一为“查看作品”。下方恰好展示3项作品：第1项用宽幅截图与职责摘要，第2、3项并排展示；窄屏依次单列，顺序不变。每项链接沿用原地址。
动效仅用于按钮悬停反馈，不增加自动滚动。没有用户规模证据，因此不放客户墙或增长数字。继续使用普通CSS，深浅主题按现有品牌约定确认后实施。
方法说明
以下为站内中文使用说明，不是上游 SKILL.md 原文。固定版本原文：https://github.com/Leonxlnx/taste-skill/blob/ce26fc25c0e5e8cab638f883de62d9a86ee5e45b/skills/taste-skill/SKILL.md 先判断页面目的与保留范围，再确定版式、视觉密度和动效，完成展示页与多视口检查。 具体任务 规划并实现一页作品展示：从受众和真实内容确定设计方向，安排信息顺序、移动布局与有目的的交互。 保留品牌改进现有展示页：先审查颜色、路径、文案与统计依赖，再进行聚焦视觉改进。 必需材料 页面类型、目标受众与真实待展示内容 现有品牌资产/项目技术栈及新建或改版的保留范围 可选材料 参考页面与明确的视觉偏好 图像素材、生成能力和目标设备 使用门槛 目标是落地页、作品集或展示型改版；能提供真实内容并具备项目实现与浏览器检查能力。 这个 Skill 额外提供的方法 先按受众判断设计方向，再用版式变化、密度和动效强度约束全页，兼顾品牌保留、减弱动效和实际首屏可读性。 编辑示例（未运行） 让招聘者先看到三项真实作品 任务：为前端工程师作品集写出页面设计决定 输入： 编辑材料：受众是招聘者，现有蓝色标志须保留；有3个作品及各自截图，无公开用户规模数据。原项目为React与普通CSS，只做展示页，已有项目详情链接不能变更。 结果片段： 设计判断：面向招聘者的前端作品集，以清楚浏览项目和职责为主，保留蓝色品牌强调，采用浅色开放布局。 首屏标题“把复杂流程做成可用界面”，正文只说明个人职责，主入口统一为“查看作品”。下方恰好展示3项作品：第1项用宽幅截图与职责摘要，第2、3项并排展示；窄屏依次单列，顺序不变。每项链接沿用原地址。 动效仅用于按钮悬停反馈，不增加自动滚动。没有用户规模证据，因此不放客户墙或增长数字。继续使用普通CSS，深浅主题按现有品牌约定确认后实施。 这是编辑构造的设计决定片段，尚未实现页面或验证视口，不代表原Skill已运行或真实作品履历。 首次任务 请使用已安装的 design-taste-frontend Skill。 任务：规划并实现一页作品展示。 从受众和真实内容确定设计方向，安排信息顺序、移动布局与有目的的交互。 必需材料： - 页面类型、目标受众与真实待展示内容：[填写或粘贴我的实际材料] - 现有品牌资产/项目技术栈及新建或改版的保留范围：[填写或粘贴我的实际材料] 可选材料： - 参考页面与明确的视觉偏好：[有则补充；缺失时不要假定存在] - 图像素材、生成能力和目标设备：[有则补充；缺失时不要假定存在] 处理边界：源入口明确不面向密集仪表盘、数据表格、多步表单、原生移动或实时协作界面的完整设计。；改版时不得静默改变路由、主导航、表单字段、品牌标志或法律文字；需要调整时明确审阅范围。。先指出影响任务的材料缺口；没有实际执行的操作和测试不要写成已完成。 请按以下标准交付可审阅结果： 1. 设计方向能对应受众与实际内容，展示指标和背书都有来源。 2. 现有品牌、路由与统计依赖按约定保留，新增依赖版本可追溯。 3. 实现后检查首屏、窄屏、键盘和减弱动效，未测性能不写成达标。 验收方法 设计方向能对应受众与实际内容，展示指标和背书都有来源。 现有品牌、路由与统计依赖按约定保留，新增依赖版本可追溯。 实现后检查首屏、窄屏、键盘和减弱动效，未测性能不写成达标。 依赖与准备 完整taste-skill是设计与实现指导，图像素材依赖宿主工具或已授权资源；默认示例涉及React/Next.js、Tailwind v4、Motion，已有项目需核对实际版本。使用shadcn前固定审定版本；Block Library在入口中声明为逐步补充的契约，不能假定所有列出的块文件都已存在。 使用边界 源入口明确不面向密集仪表盘、数据表格、多步表单、原生移动或实时协作界面的完整设计。 改版时不得静默改变路由、主导航、表单字段、品牌标志或法律文字；需要调整时明确审阅范围。 示例安装含shadcn@latest浮动版本，采用前先核对项目兼容性并固定版本；视觉建议不替代依赖与真实设备验证。 本站示例由编辑撰写，未运行上游 Skill，不代表平台已完成工具兼容认证。 排错 页面仍像重复的模板卡片：按内容工作量调整区块结构和图文比例，保留统一配色与圆角规则，避免每区块重复同一布局。 复杂动画影响手机使用：降低动效强度，保留静态可读布局，检查清理逻辑与prefers-reduced-motion，再实测交互。 固定来源 https://github.com/Leonxlnx/taste-skill/blob/ce26fc25c0e5e8cab638f883de62d9a86ee5e45b/skills/taste-skill/SKILL.md 许可 MIT。许可原文：https://github.com/Leonxlnx/taste-skill/blob/ce26fc25c0e5e8cab638f883de62d9a86ee5e45b/LICENSE 仓库热度 Leonxlnx/taste-skill 仓库 91,300 Stars（2026-09-30 核验）；这是父仓库指标，不是单个 Skill 的评分。