Frontend design, implementation, and production QA
设计与多媒体
Frontend Design
试用Produce frontend UI that actually looks designed — a working spacing/type system, deliberate color use, real states, and restraint — instead of the generic A...
它能做什么
Produce frontend UI that actually looks designed — a working spacing/type system, deliberate color use, real states, and restraint — instead of the generic AI-generated interface. Use when asked to build or restyle a UI, landing page, dashboard, or component, when output 'works but looks like a prototype', or to establish the visual system for a new app. Produces working HTML/CSS (or framework components) built on an explicit token system, with hover/focus/empty/loading states included. For critiquing an existing design use design-critique; for auditing a design system use design-system-audit.
技能文档
这个技能的完整文档还没被收录,可以先到原始来源页查看。
相关技能
Frontend design, implementation, and production QA
Produce distinctive, non-generic UI and design applications well, working strategy-first. Identify the project (landing page, SaaS app, dashboard, ecommerce, presentation, docs, portfolio...) and its positioning and personality, commit to brand adjectives, translate into a typography and color system, then apply the craft layer (layout, components and states, motion, iconography, imagery, dark mode and theming, accessibility), avoiding the AI-slop / Claude-esque default. This is both a de-slop and an expert app-design skill. Use this whenever building or styling any web frontend, app, dashboard, landing page, deck, or artifact, or when the user says "make it not look like AI", "de-slopify", "deslop", "less generic", "give it character", "design a UI for X", "design an app", "update DESIGN.md", or complains the output looks like every other AI site. Trigger even when the user just says "build a UI for X" without naming an aesthetic, because the default without this skill is slop.
Build polished, conversion-aware frontends with strong visual taste, clear hierarchy, and production-grade HTML/CSS/JS. Landing pages, dashboards, components...
用可量化的层级、间距、字号、配色与版式规则,绘制并诊断视觉作品。
创建高质量前端界面,避免AI审美同质化,支持组件/页面/应用设计,适合个人开发者。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互,无需复杂配置即开即用。输出结果可直接使用,减少二次加工成本。提供结构化输出和错误处理机制。
paudyyin 的更多技能
浏览全部技能Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, gener...
Measure bottlenecks then optimize for performance
Add observability and instrumentation to applications �� metrics, logs, traces, and dashboards
Threat-model and harden applications against security vulnerabilities
Manage Git commits, branches, merges, and versioning with structured workflows
Tavily AI 搜索工具,专为AI Agent设计的联网搜索能力,支持实时搜索、深度研究、图片搜索、引用生成,返回结构化搜索结果。