lightdash/lightdash✦ 精选0°

frontend-design

仓库创建 2021年3月19日最近提交 6 天前SkillHot 收录 6 天前

⬈ GitHub 仓库 ⬈ SKILL.md 原文件 ⬇ Raw 原始文件

▸ 精选理由

适合追求美感与可维护性的前端开发者。

这个 Skill 做什么

生成高质量、具有辨识度的前端界面与可复用组件代码。

把页面、组件或应用做成有辨识度的高质量前端界面，输出能直接投产的代码和样式。用在需要实现特定 UI、交互或复用组件的时候。强调创意与审美细节，避免那种千篇一律的“AI 风”，同时兼顾可用性与可维护性。

▸ 展开 SKILL.md 英文原文

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

开发编程前端设计组件生成高质量代码通用

6.0k

Stars

750

Forks

仓库内 Skill

7 日增星

安装 / 使用

给你的 Agent 一句话（通用）

帮我安装这个 skill：https://raw.githubusercontent.com/lightdash/lightdash/main/sandboxes/data-apps/template/.claude/skills/frontend-design/SKILL.md

或 curl 直取 SKILL.md

curl -fsSL "https://raw.githubusercontent.com/lightdash/lightdash/main/sandboxes/data-apps/template/.claude/skills/frontend-design/SKILL.md"

SKILL.MD 节选查看完整文件 ↗

This skill guides creation of distinctive, production-grade frontend interfaces that avoid generic "AI slop" aesthetics. Implement real working code with exceptional attention to aesthetic details and creative choices.

The user provides frontend requirements: a component, page, application, or interface to build. They may include context about the purpose, audience, or technical constraints.

## Design Thinking

Before coding, understand the context and commit to a BOLD aesthetic direction:
- **Purpose**: What problem does this interface solve? Who uses it?
- **Tone**: Pick an extreme: brutally minimal, maximalist chaos, retro-futuristic, organic/natural, luxury/refined, playful/toy-like, e

via SKILL·HOT · 数据来自 GitHub 公开信息 · 原文版权归作者所有