设计与多媒体

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.

6 次安装

Build polished, conversion-aware frontends with strong visual taste, clear hierarchy, and production-grade HTML/CSS/JS. Landing pages, dashboards, components...

59 次安装2 星标

用可量化的层级、间距、字号、配色与版式规则,绘制并诊断视觉作品。

作者 Iván138 次安装6 星标

创建高质量前端界面,避免AI审美同质化,支持组件/页面/应用设计,适合个人开发者。Use when 需要设计创作、UI设计、海报制作、品牌视觉时使用。不适用于3D建模和动画制作。适用于独立开发者、企业团队和自动化工作流场景。支持中文交互,无需复杂配置即开即用。输出结果可直接使用,减少二次加工成本。提供结构化输出和错误处理机制。

1 次安装

paudyyin 的更多技能

浏览全部技能

Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, gener...

作者 paudyyin1 次安装

Threat-model and harden applications against security vulnerabilities

作者 paudyyin1 次安装

Tavily AI 搜索工具,专为AI Agent设计的联网搜索能力,支持实时搜索、深度研究、图片搜索、引用生成,返回结构化搜索结果。

作者 paudyyin13 次安装1 星标