darker2016/workbuddy-skill-groups/software-workshop

Claude Code and agent skill by darker2016/workbuddy-skill-groups

Trust tier 3
  • community
Source check pending

Checking that the SKILL.md file is still in the repository.

Install

npx vskill@latest install darker2016/workbuddy-skill-groups/software-workshop

SKILL.md

Design HTML Skill — 生产级 HTML/CSS 生成

使用 Pretext 框架生成生产级 HTML/CSS。支持从零构建或基于已批准的设计稿。
30KB 框架开销,零外部依赖。

触发词

  • design to HTML
  • implement design
  • generate HTML CSS
  • design implementation

关键特性

  • 30KB 框架开销,零外部依赖
  • 智能 API 路由:为每种设计类型选择正确的 Pretext 模式
  • 自包含输出文件(HTML + CSS 内嵌)
  • 移动端响应式布局
  • 语义化、干净的标记

Vendor

文件说明
vendor/pretext.jsPretext 框架库

工作流

1. Input

接收设计上下文(设计稿描述、DESIGN.md 引用、产品评审输出等)。

2. Pattern selection

根据设计类型选择合适的 Pretext 模式。

3. Generate HTML/CSS

使用 Pretext 框架生成生产级输出。

4. Verify

检查输出渲染是否正确,是否符合设计意图。

5. Deliver

写入最终 HTML/CSS 文件。


输出

  • 自包含 HTML 文件(CSS 内嵌)
  • 移动端响应式布局
  • 干净的语义化标记
  • 正确应用的 Pretext 框架模式

使用方式

在以下场景中使用:

场景详见
设计系统预览05-gstack-designer-agent.md — Design Consultation Phase 5
设计变体探索05-gstack-designer-agent.md — Design Shotgun
设计落地实现主理人调度 designer 时,直接引用此 skill

本 Skill 定义源自 GStack 软件工坊插件 skills/design-html/SKILL.md

Security

  • Security scanPassed, 90 of 100Pattern checks on the skill's files.
  • Model reviewPassed

Quality evaluation

  • Task evaluationNot runNo evaluation yet. Run one in Skill Studio.

Source

Popularity

Repository stars
24
Repository forks
2
7-day trend score
21

Stars and forks are for the whole GitHub repository, not this skill alone. Not refreshed yet.

Works with

Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.

  • Claude Code
  • Cursor
  • GitHub Copilot
  • Windsurf
  • Codex
  • Gemini CLI
  • Cline
  • Amp
  • Roo Code
  • Goose
  • Continue
  • Kilo Code
  • Junie
  • Trae
  • OpenHands
  • Qwen Code
  • AI Agent
  • Tabnine Chat
  • Sourcegraph Cody
  • Amazon Q
  • Firebase Genkit
  • Sweep
  • Devin
  • Phind
  • Mentat
  • Claude Desktop
  • Aider
  • GPT Pilot
  • Plandex
  • bolt.new
  • v0
  • Replit Agent
  • Anse
  • TypingMind
  • BetterChatGPT
  • LibreChat
  • Warp AI
  • Pieces
  • Fig AI
Embed badge
vskill VERIFIED badge
[![vskill VERIFIED](https://verified-skill.com/api/v1/skills/darker2016/workbuddy-skill-groups/software-workshop/badge)](https://verified-skill.com/skills/darker2016/workbuddy-skill-groups/software-workshop)

Something wrong with this skill or its page? Tell us.