用途
该技能用于将用户提供的文本内容转换为单文件、响应式的 HTML 网页。它内置一个包含 30 种独特设计风格的库（源自 designprompts.dev），并定位为“设计顾问”：分析文本后推荐最合适的风格，或接受用户指定的风格请求。
主要能力
- 内容分析：确定用户文本的语气、受众和目的。
- 风格选择：
- 用户指定：若用户要求特定风格（例如“赛博朋克”），则在风格矩阵中进行匹配。
- 智能推荐：若未指定，则根据内容分析结果，从风格矩阵中选择最契合的风格。
- 决胜机制：若多种风格都适合或内容较为中性，则基于视觉多样性或“顾问精选”进行选择，并提供有说服力的理由。
- 加载提示词：从 references/ 目录读取相应的设计系统文件（例如 references/cyberpunk.md）。
- 生成网页：将读取到的风格提示词与用户内容结合，生成 HTML 代码。
使用方式
- 选择：首先告知用户所选风格及理由。示例：“考虑到您内容的专业技术性质，我选择了 'Terminal'（终端）风格，以为其赋予一种复古未来的黑客氛围。”
- 工具使用：使用 read 工具读取风格矩阵中对应的参考文件内容。
- 生成：将用户文本和参考文件内容传递给编码模型，并给出指令：“你是一名专家级前端工程师。请使用参考内容中定义的设计系统，将用户的文本转换为一个单文件 HTML 网页。确保严格遵守参考文件中定义的颜色、字体和布局规则。”
风格矩阵
技能内置 30 种风格，每种包含 ID、风格名称、视觉氛围、适用场景、关键词和参考文件：
- 01 Monochrome：严谨、社论感、高对比度；适用于时尚、建筑、奢侈品博客；关键词为黑白、衬线体、锐利；参考文件 references/monochrome.md。
- 02 Bauhaus：几何感、构成主义、大胆；适用于海报、艺术作品集、创意机构；关键词为三原色、形状、不对称；参考文件 references/baohaus.md。
- 03 Modern Dark：电影感、氛围感、发光；适用于开发者工具、SaaS、高科技；关键词为暗黑模式、渐变、聚光灯；参考文件 references/modernDark.md。
- 04 Newsprint：权威、密集、经典；适用于新闻、博客、长文阅读；关键词为网格、衬线体、米白、边框；参考文件 references/newsprint.md。
- 05 SaaS：干净、值得信赖、现代；适用于初创公司、产品落地页；关键词为蓝色点缀、Inter 字体、留白；参考文件 references/saas.md。
- 06 Luxury：优雅、宽敞、高级；适用于珠宝、高端服务、酒店；关键词为金色、衬线体、极简、慢动作；参考文件 references/luxury.md。
- 07 Terminal：复古未来、黑客、原始；适用于开发博客、CLI 工具、加密货币；关键词为等宽字体、绿/黑、光标；参考文件 references/terminal.md。
- 08 Swiss Minimalist：客观、网格化、理性；适用于企业报告、建筑、瑞士设计；关键词为 Helvetica、红色点缀、严谨网格；参考文件 references/swissMinimalist.md。
- 09 Kinetic：动态、移动、喧闹；适用于活动推广、作品集、潮流；关键词为跑马灯、大字、动效；参考文件 references/kinetic.md。
- 10 Flat Design：2D、多彩、简单；适用于插画作品集、趣味应用；关键词为纯色、无阴影、矢量感；参考文件 references/flatDesign.md。
- 11 Art Deco：装饰性、几何、金色；适用于请柬、历史、地下酒吧；关键词为金线、对称、1920 年代；参考文件 references/artDeco.md。
- 12 Material Design：触感、熟悉、谷歌风；适用于安卓应用、仪表盘；关键词为阴影、涟漪、纸张层级；参考文件 references/materialDesign.md。
- 13 Neo Brutalism：原始、未打磨、大胆；适用于 Z 世代品牌、艺术、前卫博客；关键词为高对比、默认字体、粗边框；参考文件 references/neoBrutalism.md。
- 14 Bold Typography：喧闹、文字为主、图形化；适用于宣言、声明、海报；关键词为巨型文本、负空间；参考文件 references/boldTypography.md。
- 15 Academia：传统、温暖、学术；适用于大学、研究、文学；关键词为米色、衬线体、红/金、纸张；参考文件 references/academia.md。
- 16 Cyberpunk：反乌托邦、霓虹、故障；适用于游戏、科幻、夜生活；关键词为霓虹粉/蓝、故障风、暗黑；参考文件 references/cyberpunk.md。
- 17 Web3：数字化、金融、深邃；适用于加密货币、NFT、金融科技；关键词为橙/蓝、暗黑、数据可视化；参考文件 references/web3.md。
- 18 Playful Geometric：有趣、活力、形状；适用于儿童、创意机构、初创公司；关键词为孟菲斯风格、亮色；参考文件 references/playfulGeometric.md。
- 19 Minimal Dark：光滑、柔和、磨砂；适用于个人网站、笔记、情绪板；关键词为深灰、琥珀微光、毛玻璃；参考文件 references/minimalDark.md。
- 20 Claymorphism：柔软、3D、玩具感；适用于亲和力应用、教育；关键词为 3D、阴影、马卡龙色、圆润；参考文件 references/claymorphism.md。
- 21 Professional：经典、干净、衬线体；适用于律所、简历、咨询；关键词为象牙白、衬线体、平衡；参考文件 references/professional.md。
- 22 Botanical：有机、自然、柔和；适用于健康、食品、自然；关键词为大地色、圆润、绿色；参考文件 references/botanical.md。
- 23 Vaporwave：怀旧、超现实、粉色；适用于音乐、复古博客、艺术；关键词为 80 年代、粉/青、网格、雕像；参考文件 references/vaporwave.md。
- 24 Enterprise：可靠、企业感、蓝色；适用于 B2B、大型组织、内网；关键词为靛蓝、等轴测、干净；参考文件 references/enterprise.md。
- 25 Sketch：手绘、随性、粗糙；适用于笔记、DIY、个人博客；关键词为涂鸦、铅笔、纸张；参考文件 references/sketch.md。
- 26 Industrial：技术、原始、工程感；适用于硬件、工具、规格说明；关键词为橙色、灰色、等宽字体、线条；参考文件 references/industrial.md。
- 27 Neumorphism：柔软、物理感、凸起；适用于智能家居、控制面板、播放器；关键词为柔和阴影、单色；参考文件 references/neumorphism.md。
- 28 Organic：流动、自然、侘寂；适用于陶瓷、健康、生活方式；关键词为斑点形状、纹理、土色；参考文件 references/organic.md。
- 29 Maximalism：混乱、繁忙、表现力；适用于独立杂志、艺术、时尚；关键词为撞色、密集、图案；参考文件 references/maximalism.md。
- 30 Retro：怀旧、低保真、像素；适用于旧科技、游戏、档案馆；关键词为 Windows 95、像素、米色；参考文件 references/retro.md。
适用场景
适用于需要将文本快速转化为具有特定设计风格网页的场景，例如博客文章、产品落地页、作品集、活动推广页、个人网站等。用户可指定风格，也可由技能根据内容自动推荐。
限制
资料未提供关于收费、价格、平台支持范围、生成效果保证或具体使用步骤的更多信息。