Agent Skills
› nextlevelbuilder/ui-ux-pro-max-skill
nextlevelbuilder/ui-ux-pro-max-skill
GitHub提供跨平台横幅设计能力,支持社交媒体、广告及网站头图。通过HTML/CSS构建视觉元素,结合品牌规范与多种艺术风格,生成多方案选项并遵循安全区与对比度标准。
Install All Skills
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --all -g -y
Skills in Collection (13)
提供跨平台横幅设计能力,支持社交媒体、广告及网站头图。通过HTML/CSS构建视觉元素,结合品牌规范与多种艺术风格,生成多方案选项并遵循安全区与对比度标准。
用户请求横幅、封面或头部视觉设计
需要为特定平台(如Facebook、Instagram)创建广告或展示素材
生成网站Hero Section的视觉设计方案
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill banner-design -g -y
管理品牌身份、语调、视觉规范和资产一致性,提供上下文注入、资产验证及设计令牌同步脚本,确保内容符合品牌指南。
创建或审核品牌相关内容
同步品牌指南到设计令牌
验证设计资产合规性
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill brand -g -y
提供设计系统构建能力,涵盖三层Token架构、组件规范定义及CSS变量体系。支持设计到代码交接、Tailwind配置及品牌合规演示文稿生成,辅助前端与UI/UX协作。
创建或更新设计Token
定义组件状态与变体
生成符合品牌规范的幻灯片
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill design-system -g -y
用于创建基于 HTML 和 Chart.js 的战略演示文稿,支持数据可视化、响应式布局及文案优化。适用于营销展示、路演幻灯片及数据驱动型内容制作。
制作营销演示文稿或路演幻灯片
需要嵌入 Chart.js 图表的数据驱动型展示
优化演示内容的排版与文案策略
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -g -y
用于构建美观、可访问的用户界面,结合shadcn/ui组件、Tailwind CSS样式及Canvas视觉设计。支持响应式布局、主题定制、暗模式及复杂UI模式实现。
构建用户界面
实现可访问组件
使用Tailwind进行样式开发
创建响应式布局
自定义主题或暗模式
生成视觉设计稿
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill ui-styling -g -y
提供Web、移动和桌面端的UI/UX设计智能支持。用于界面设计、组件构建、设计规范审查及交互优化,涵盖无障碍、布局、色彩、动画等10大优先级规则,辅助提升用户体验与视觉质量。
设计新页面或重构UI组件
审查界面的可访问性、一致性和可用性
选择颜色、字体或响应式布局系统
实现导航、动画或交互行为
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill ui-ux-pro-max -g -y
用于设计社交媒体、广告、网站横幅及印刷品等多格式创意素材。通过收集需求、研究风格,利用HTML/CSS或图像生成工具创建多种视觉方案,确保符合平台尺寸与安全区域规范。
用户请求横幅、封面或头部设计
社交媒体封面/标题创建
广告横幅或展示广告设计
网站英雄区视觉设计
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill banner-design -g -y
管理品牌身份、语音语调、视觉规范及资产一致性。提供脚本注入品牌上下文、验证资产、提取颜色并同步设计令牌,确保营销内容与品牌指南合规。
定义品牌语音和语调
创建或更新品牌风格指南
验证营销资产是否符合品牌规范
同步品牌色彩与排版到代码库
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill brand -g -y
提供设计系统构建能力,涵盖三层Token架构、组件规范及CSS变量管理。支持设计到代码的交接、Tailwind配置生成,并包含演示文稿生成与合规性验证脚本,辅助前端与UI设计师建立品牌一致性。
创建或更新设计Token
定义组件状态与变体
配置CSS变量或Tailwind主题
生成品牌合规的演示幻灯片
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill design-system -g -y
用于创建基于HTML和Chart.js的战略演示文稿,支持数据可视化、响应式布局及文案优化,适用于营销路演和数据驱动型幻灯片制作。
需要制作营销演示文稿或路演幻灯片
需要在幻灯片中集成Chart.js进行数据可视化
需要优化演示内容的文案与排版策略
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill slides -g -y
用于构建美观、可访问的用户界面,结合shadcn/ui组件、Tailwind CSS样式及Canvas视觉设计。适用于React框架下的UI开发、响应式布局、主题定制及设计系统搭建。
构建用户界面
实现可访问组件
使用Tailwind CSS进行样式设计
创建响应式布局
生成视觉设计或海报
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill ui-styling -g -y
统一设计技能,涵盖品牌识别、设计系统、UI样式、Logo生成、企业身份程序、演示文稿、横幅及社交媒体图片制作。支持通过AI工具自动生成各类视觉资产与Mockup。
需要创建或优化品牌视觉标识
生成Logo、图标或Banner等营销素材
构建UI组件库或设计令牌
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill design -g -y
统一的设计技能,涵盖品牌识别、设计系统、UI样式、Logo生成、企业身份程序、演示文稿、横幅及社交媒体图片等。支持多种AI图像生成模型和脚本自动化操作。
需要创建或优化品牌视觉资产
请求生成Logo、图标或Banner
需要制作演示文稿或社交媒体图片
npx skills add nextlevelbuilder/ui-ux-pro-max-skill --skill design -g -y


