技能 design-taste-frontend-v1
📦
design-taste-frontend-v1
内容修订 r1 安全 ⚙️ 外部命令🌐 网络访问
提升前端设计品味
AI 生成的前端作品可能显得泛化，并遗漏响应式状态。此技能为 Claude、Codex 和 Claude Code 提供带有明确取向的 UI 规则，以生成更精致的 React 和 Tailwind 输出。
支持: Claude Codex Code(CC)
使用我的智能体安装
将此请求复制给你的智能体，其中包含权威 Skill 页面和清单。
智能体请求
Review the Skillstore skill "design-taste-frontend-v1" from https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1.md and its manifest at https://skillstore.io/api/skills/leonxlnx-design-taste-frontend-v1/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.你的智能体仍应展示其计划，并按安全策略请求必要确认。
Agent 可读资源
当 AI Agent、爬虫或脚本需要干净上下文，而不是读取完整页面时，请使用这些链接。
测试它
正在使用“design-taste-frontend-v1”。 Create a SaaS dashboard for operations managers.
预期结果:
响应会在实现前描述一个非对称仪表板布局、克制的调色板、清晰的表单状态以及移动端折叠规则。
正在使用“design-taste-frontend-v1”。 Improve a product landing page that looks generic.
预期结果:
响应会用更强的构图、独特的排版、具体的图片指导和更清晰的行动号召层级，替换默认的居中 hero 模式。
正在使用“design-taste-frontend-v1”。 Add motion to a feature grid without hurting performance.
预期结果:
响应会建议使用隔离的动画组件、基于 spring 的过渡、记忆化循环以及仅使用 transform 的动画选择。
安全审计
安全v4 • 2026/7/6 打开版本化报告
The static alerts are false positives caused by Markdown backticks and design prose in SKILL.md. I found no executable code, shell invocation, secret access, prompt-injection attempt, or malicious network behavior. No semantic security findings were added.
1
已扫描文件
227
分析行数
0
复核项
0
已忽略误报
风险因素
⚙️ 外部命令 (55)
SKILL.md:3 SKILL.md:18 SKILL.md:19 SKILL.md:20 SKILL.md:21 SKILL.md:22 SKILL.md:24 SKILL.md:25 SKILL.md:28 SKILL.md:29 SKILL.md:30 SKILL.md:31 SKILL.md:32 SKILL.md:39 SKILL.md:40 SKILL.md:41 SKILL.md:42 SKILL.md:50 SKILL.md:53 SKILL.md:61 SKILL.md:64 SKILL.md:68 SKILL.md:69 SKILL.md:70 SKILL.md:71 SKILL.md:72 SKILL.md:75 SKILL.md:76 SKILL.md:77 SKILL.md:82 SKILL.md:83 SKILL.md:84 SKILL.md:85 SKILL.md:88 SKILL.md:89 SKILL.md:90 SKILL.md:95 SKILL.md:101 SKILL.md:102 SKILL.md:108 SKILL.md:119 SKILL.md:124 SKILL.md:125 SKILL.md:197 SKILL.md:198 SKILL.md:199 SKILL.md:201 SKILL.md:205 SKILL.md:206 SKILL.md:208 SKILL.md:212 SKILL.md:215 SKILL.md:221 SKILL.md:222 SKILL.md:223
🌐 网络访问 (1)
最新一次完成的静态与语义审计未检测到已确认的安全发现。这并不能证明该 Skill 没有副作用。
审计者: codex 查看审计历史 →
分享与引用此报告
分享版本化评估报告、中性徽章、嵌入卡片和引用。Skillstore 只报告证据，不判断该 Skill 是否安全。
复制报告链接
https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/leonxlnx-design-taste-frontend-v1/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/leonxlnx-design-taste-frontend-v1.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>学术引用 (APA · BibTeX · CFF)
APA 引用
leonxlnx. (2026). design-taste-frontend-v1 security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1/audits/4BibTeX 引用
@techreport{leonxlnx-leonxlnx-design-taste-frontend-v1-2026,
author = {leonxlnx},
title = {design-taste-frontend-v1 security audit report (audit version 4)},
institution = {Skillstore},
year = {2026},
number = {4},
url = {https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1/audits/4},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "design-taste-frontend-v1 security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
- name: "leonxlnx"
date-released: "2026-07-06"
url: "https://skillstore.io/skills/leonxlnx-design-taste-frontend-v1/audits/4"
identifiers:
- type: other
value: "skillstore:leonxlnx-design-taste-frontend-v1:audit:4"
description: "Skillstore immutable audit report identifier"
Skillstore 评分
评分依据 证据置信度: 高 55
架构
85
可维护性
87
内容
73
社区
83
规范符合性
你能构建什么
优化产品界面
在实现复杂产品界面前，使用该技能设置布局、排版、动效和状态指导。
塑造品牌界面
在创建落地页、功能区块或产品驱动的营销页面时，应用更强的视觉方向。
审查 AI 原型
使用预检清单发现泛化布局、缺失状态和薄弱的响应式行为。
试试这些提示
应用基线
Use design-taste-frontend-v1 for a React interface. Create a [screen type] for [audience]. Use Tailwind. Include loading, empty, and error states.
重新设计静态页面
Apply the skill to redesign this page. Keep the same content. Improve layout, typography, responsive behavior, and interaction states.
构建动效系统
Use the skill with motion intensity above five. Add purposeful Framer Motion interactions. Isolate animated client components and protect performance.
审计复杂仪表板
Review this dashboard concept with the skill checklist. Identify generic patterns, weak hierarchy, missing states, and mobile risks. Then propose focused fixes.
最佳实践
- 在生成前提供受众、产品领域、技术栈和视觉约束。
- 当现有品牌 token 或组件规则必须覆盖该技能时，请共享它们。
- 在第一个提示词中请求加载、空、错误和移动端状态。
避免
- 在没有品牌、受众或产品上下文的情况下请求通用落地页。
- 当严格的企业设计系统必须控制每个选择时使用该技能。
- 在性能敏感页面上添加没有明确用户收益的持续动效。
常见问题
这个技能帮助生成什么？
它引导 AI 工具生成更强的前端布局、样式、动效和界面状态。
它包含可运行代码吗？
不。它是一个用于指导生成前端代码的指令技能。
它面向哪些技术栈？
它主要面向 React、Next.js、Tailwind CSS 和常见动效库。
它可以遵循现有设计系统吗？
可以。先提供系统规则，然后要求模型适配这份指导。
它能替代设计审查吗？
不能。它能改善初稿，但团队仍应审查可访问性和品牌契合度。
为什么使用 v1 技能？
当工作流程依赖原始指令风格和精确行为时使用它。