尧图网站建设 
Brand Guidelines v{X.Y}【免费下载链接】ui-ux-pro-max-skillAn AI skill that provides design intelligence for building professional UI/UX across multiple platforms.项目地址: https://gitcode.com/gh_mirrors/ui/ui-ux-pro-max-skillQuick ReferencePrimary Color:#XXXXXXSecondary Color:#XXXXXXPrimary Font:{font-family}Voice:{3 key traits}1. Color Palette2. Typography3. Logo Usage4. Voice Tone5. Imagery Guidelines这套结构有两条设计意图 1. **快速参考先行**把最重要的三个要素主色、主字体、声音特质放在文档最顶部既方便人扫读也方便解析器优先定位。从 [inject-brand-context.cjs](https://link.gitcode.com/i/f3d956ad9975c04e67b267a7f0640c40) 的源码看它专门用 Quick Reference 里的 Primary Color / Secondary Color 正则/Primary Color\s*\|\s*#([A-Fa-f0-9]{6})/i兜底提取基础色。 2. **版本化治理**标题自带 v{X.Y} 占位配合文档末尾的 Changelog 表格让品牌规范的每次变更都可追溯。仓库的 starter 模板 [brand-guidelines-starter.md](https://link.gitcode.com/i/73b52c2c48f098e2e30c45383aa458a4) 在末尾就提供了 | 1.0 | {DATE} | Initial guidelines | 这样的变更记录示例。 ## 一、Quick Reference品牌信息的一屏速览 快速参考区把品牌的核心标识压缩成四行模板给出的形式是列表 markdown ## Quick Reference - **Primary Color:** #XXXXXX - **Secondary Color:** #XXXXXX - **Primary Font:** {font-family} - **Voice:** {3 key traits}starter 模板提供了真实填法示例也兼容表格形式ElementValuePrimary Color#2563EBSecondary Color#8B5CF6Primary FontInterVoiceProfessional, Helpful, Clear值得注意sync-brand-to-tokens.cjs的extractColorsFromMarkdown函数同时支持列表行| Primary Color | #2563EB |解析而inject-brand-context.cjs用正则匹配Primary Color ... #hex。因此填写时务必保证「字段名 冒号/竖线 6 位十六进制色值」的模式完整大小写均可解析器对 hex 不区分大小写。二、Color Palette颜色体系的四个层级与无障碍基线主色Primary Colors主色是品牌识别度最高的颜色用于 CTA、页头、链接等关键元素。模板要求每行提供 Name、Hex、RGB、Usage 四列NameHexRGBUsage{Name}#{hex}rgb({r},{g},{b})Primary brand color, CTAs, headers{Name}#{hex}rgb({r},{g},{b})Supporting accent辅色Secondary Colors辅色起衬托与高亮作用数量控制在 23 个通常包含一个强调色accent。color-palette-management.md 给出的层级建议是Primary Colors (1-2) ├── Main brand color - Used for CTAs, headers, key elements └── Supporting primary - Secondary emphasis Secondary Colors (2-3) ├── Accent colors - Highlights, interactive states └── Supporting visuals - Icons, illustrations Neutral Palette (3-5) ├── Background colors - Page, card, modal backgrounds ├── Text colors - Headings, body, muted text └── UI elements - Borders, dividers, shadows Semantic Colors (4) ├── Success - #22C55E (green) ├── Warning - #F59E0B (amber) ├── Error - #EF4444 (red) └── Info - #3B82F6 (blue)中性色板Neutral Palette中性色是界面骨架模板固定了四行结构Background页面背景、Text Primary正文、Text Secondary说明/弱化文字、Border分隔线与边框。这四行在sync-brand-to-tokens.cjs之外虽不直接参与颜色尺度生成但被inject-brand-context.cjs的### Neutral区块正则捕获后汇入品牌调色板用于后续合规比对。无障碍基线Accessibility模板强制要求记录三组对比度数据这是品牌色「可发布」的硬门槛- Text/Background Contrast: {ratio}:1 (WCAG {level}) - CTA Contrast: {ratio}:1 - All interactive elements meet WCAG 2.1 AA参照 color-palette-management.md 的 WCAG 2.1 量化标准普通文本 AA 需 4.5:1、大文本/UI 组件 3:1AAA 级普通文本 7:1、大文本 4.5:1。starter 模板给出的实测值很有参考性#111827正文配白底对比度 7.2:1AAA主色#2563EB配白底 4.6:1AA。该参考文档还给出了相对亮度与对比度的 JavaScript 计算公式可在编写指南时自行验证function luminance(r, g, b) { const [rs, gs, bs] [r, g, b].map(v { v / 255; return v 0.03928 ? v / 12.92 : Math.pow((v 0.055) / 1.055, 2.4); }); return 0.2126 * rs 0.7152 * gs 0.0722 * bs; } function contrastRatio(l1, l2) { const lighter Math.max(l1, l2); const darker Math.min(l1, l2); return (lighter 0.05) / (darker 0.05); }另外两条实战禁忌同样出自 color-palette-management.md正文不要用纯黑#000000推荐#111827一类的深灰蓝也不要仅靠颜色传达语义——错误、成功等状态应同时配图标或文字。starter 模板为此专门增加了「Semantic Colors」区块Success#22C55E、Warning#F59E0B、Error#EF4444、Info#3B82F6这是对模板的可选扩展。三、Typography字体栈、字号阶梯与加载方式模板用 CSS 变量形式定义字体栈让字体信息可以直接被设计系统消费--font-heading: {Font}, sans-serif; --font-body: {Font}, sans-serif; --font-mono: {Font}, monospace;inject-brand-context.cjs的extractTypography正是通过正则匹配--font-heading:/--font-body:/--font-mono:来提取字体名的所以这三行变量名必须保持原样。starter 模板给出了完整回退栈示例--font-heading: Inter, system-ui, -apple-system, sans-serif; --font-body: Inter, system-ui, -apple-system, sans-serif; --font-mono: JetBrains Mono, Fira Code, monospace;字号阶梯Type Scale是模板中信息密度最高的表格它同时约束 Desktop 与 Mobile 两套尺寸保证响应式下的层级一致ElementFontWeightSize (Desktop/Mobile)Line HeightH1{font}70048px / 32px1.2H2{font}60036px / 28px1.25H3{font}60028px / 24px1.3H4{font}60024px / 20px1.35Body{font}40016px / 16px1.5Small{font}40014px / 14px1.5Caption{font}40012px / 12px1.4starter 模板在此基础上补充了Body Large 18px / 1.6一档并额外提供了字体加载的link预连接写法便于直接粘贴进 HTMLlink relpreconnect hrefhttps://fonts.googleapis.com link hrefhttps://fonts.googleapis.com/css2?familyInter:wght400;500;600;700displayswap relstylesheet四、Logo Usage变体、留白、最小尺寸与红线模板把 Logo 规范收敛为四类约束变体Variants——按使用场景划分四档带字标的完整横版Primary、方形空间用的竖排版Stacked、favicon 与应用图标用的纯符号版Icon、受限配色环境的单色版Monochrome。starter 模板进一步为每个变体指定了文件命名logo-full-horizontal.svg、logo-stacked.svg、logo-icon.svg、logo-mono.svg——这与validate-asset.cjs的命名校验规则一脉相承。留白Clear Space——模板给出极简规则Minimum clear space height of logo mark最小留白等于 Logo 图形本身的高度避免其他元素侵入 Logo 的可读区。最小尺寸Minimum Size——数字与印刷分开约束Digital: 80px width minimumPrint: 25mm width minimumstarter 模板给出了更细分的版本数字横版 120px、数字图标 24px、印刷横版 35mm、印刷图标 10mm品牌方可根据自身 Logo 复杂度调整。红线清单Donts——模板固定五条禁令任何品牌指南都应继承Dont rotate or skew禁止旋转或倾斜Dont change colors outside approved palette禁止使用批准调色板之外的配色Dont add effects (shadows, gradients)禁止添加阴影、渐变等特效Dont crop or modify proportions禁止裁切或篡改比例Dont place on busy backgrounds禁止放置在杂乱背景上这些规范最终会被validate-asset.cjs以「文件名 尺寸 格式 清单注册」的形式机器化执行因此模板中的logo.variants、logo.minSize字段在填写时越精确后续资产校验越可落地。五、Voice Tone声音人格、语境语调与禁用词声音规范决定「品牌如何说话」模板把它拆成四个可量化的部分品牌人格Brand Personality——用 23 个特质词各配一句描述例如 starter 模板的Professional: Expert knowledge, authoritative yet approachable。声音对照表Voice Chart——每个特质必须同时给出「We Are」与「We Are Not」通过反例限定边界TraitWe AreWe Are Not{Trait}{Description}{Anti-description}按语境调整语调Tone by Context——同一品牌在不同场景语气不同模板强制列出 Marketing / Support / Error Messages / Success 四类语境并各配一句示例文案ContextToneExampleMarketing{tone}{example}Support{tone}{example}Error Messages{tone}{example}Success{tone}{example}starter 模板的示例非常具体营销「Create campaigns that convert.」、文档「Run the command to start.」、报错「Try refreshing the page.」、成功「Campaign published!」。禁用词Prohibited Terms——每项都要注明禁用理由例如 starter 模板列出Revolutionary过度使用、Best-in-class模糊声明、Seamless过度使用、Synergy企业黑话、Leverage建议改用 use。这些词会被inject-brand-context.cjs的extractVoice提取进voice.prohibited数组最终注入到 AI 生成内容的系统提示词中从源头拦截不符合品牌语气的文案。六、Imagery Guidelines摄影、插画与图标的风格基线图像规范帮助 AI 图像生成与设计师对齐视觉语言模板覆盖三个层次摄影风格Photography Style光照偏好、主体规范、后期色调处理插画Illustrations风格描述、仅限品牌调色板、描边粗细{weight}px图标Icons风格outlined/filled/duotone 三选一、24px 基准网格、圆角值。starter 模板给出了可直接套用的实例摄影走自然柔和光、真实人物与场景插画为现代扁平风加微渐变、2px 统一描边、4px 圆角图标为 outline 风格、24px 网格、1.5px 描边、2px 圆角。它还额外扩展了「AI 图像生成」章节——Base Prompt 模板、风格关键词表光照/情绪/构图/处理/美学、视觉情绪描述词、视觉 Donts 表与示例提示词这套扩展能被inject-brand-context.cjs的extractImageStyle完整识别它逐一匹配Base Prompt Template、Style Keywords、Visual Mood Descriptors、Visual Donts、Example Prompts区块最终作为IMAGE GENERATION段注入提示词。七、从模板到工作流四步使用法与脚本联动模板末尾给出标准使用流程Copy template above—— 复制模板全文Fill in brand-specific values—— 填入品牌专属值Save asdocs/brand-guidelines.md—— 保存为指南文档Reference in content workflows—— 在内容工作流中引用在这四步之上ui-ux-pro-max-skill 的 brand 技能把「引用」升级为「机器可执行的品牌闭环」与模板配套的四个脚本各自消费模板的一个侧面1. 品牌上下文注入inject-brand-context.cjs解析docs/brand-guidelines.md提取颜色、字体、声音、图像风格输出一段可直接拼进 AI 系统提示词的BRAND CONTEXT文本--json模式输出结构化 JSON便于程序消费。node cli/assets/skills/brand/scripts/inject-brand-context.cjs node cli/assets/skills/brand/scripts/inject-brand-context.cjs --json2. 同步到设计令牌sync-brand-to-tokens.cjs把指南中的颜色按primary / secondary / accent三种角色提取出来生成 50900 的十档色阶写入design-tokens.json再调用 design-system 技能重新生成design-tokens.css。模板中的### Primary Colors等标题就是它的解析锚点——标签含dark的行归入深色档、含light的行归入浅色档其余首个颜色作为 base 色node cli/assets/skills/brand/scripts/sync-brand-to-tokens.cjs node cli/assets/skills/brand/scripts/sync-brand-to-tokens.cjs --dry-run--dry-run只预览将要写入的颜色尺度而不落盘适合正式同步前检查解析结果。注意它硬编码读取工作区根目录的docs/brand-guidelines.md与模板第 3 步的保存路径约定一致。3. 颜色合规校验extract-colors.cjs--palette模式直接打印指南中按主/辅/中性/语义分组的品牌调色板传入图片路径时生成 ImageMagick 提取指令并以 RGB 欧氏距离 ≤50 为阈值计算品牌合规百分比calculateCompliance。这让模板中的色值成为可执行的「品牌色白名单」。node cli/assets/skills/brand/scripts/extract-colors.cjs --palette node cli/assets/skills/brand/scripts/extract-colors.cjs image-path --brand-file docs/brand-guidelines.md4. 资产命名与尺寸校验validate-asset.cjs按{type}_{campaign}_{description}_{timestamp}_{variant}.{ext}命名约定校验营销资产的命名、格式、尺寸与文件大小并检查是否注册进.assets/manifest.json。它对图片默认限 5MB推荐 1MB、SVG 限 500KB未达标时给出建议文件名node cli/assets/skills/brand/scripts/validate-asset.cjs asset-path node cli/assets/skills/brand/scripts/validate-asset.cjs asset-path --json【免费下载链接】ui-ux-pro-max-skillAn AI skill that provides design intelligence for building professional UI/UX across multiple platforms.项目地址: https://gitcode.com/gh_mirrors/ui/ui-ux-pro-max-skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Brand Guidelines v{X.Y}
Brand Guidelines v{X.Y}【免费下载链接】ui-ux-pro-max-skillAn AI skill that provides design intelligence for building professional UI/UX across multiple platforms.项目地址: https://gitcode.com/gh_mirrors/ui/ui-ux-pro-max-skillQuick ReferencePrimary Color:#XXXXXXSecondary Color:#XXXXXXPrimary Font:{font-family}Voice:{3 key traits}1. Color Palette2. Typography3. Logo Usage4. Voice Tone5. Imagery Guidelines这套结构有两条设计意图 1. **快速参考先行**把最重要的三个要素主色、主字体、声音特质放在文档最顶部既方便人扫读也方便解析器优先定位。从 [inject-brand-context.cjs](https://link.gitcode.com/i/f3d956ad9975c04e67b267a7f0640c40) 的源码看它专门用 Quick Reference 里的 Primary Color / Secondary Color 正则/Primary Color\s*\|\s*#([A-Fa-f0-9]{6})/i兜底提取基础色。 2. **版本化治理**标题自带 v{X.Y} 占位配合文档末尾的 Changelog 表格让品牌规范的每次变更都可追溯。仓库的 starter 模板 [brand-guidelines-starter.md](https://link.gitcode.com/i/73b52c2c48f098e2e30c45383aa458a4) 在末尾就提供了 | 1.0 | {DATE} | Initial guidelines | 这样的变更记录示例。 ## 一、Quick Reference品牌信息的一屏速览 快速参考区把品牌的核心标识压缩成四行模板给出的形式是列表 markdown ## Quick Reference - **Primary Color:** #XXXXXX - **Secondary Color:** #XXXXXX - **Primary Font:** {font-family} - **Voice:** {3 key traits}starter 模板提供了真实填法示例也兼容表格形式ElementValuePrimary Color#2563EBSecondary Color#8B5CF6Primary FontInterVoiceProfessional, Helpful, Clear值得注意sync-brand-to-tokens.cjs的extractColorsFromMarkdown函数同时支持列表行| Primary Color | #2563EB |解析而inject-brand-context.cjs用正则匹配Primary Color ... #hex。因此填写时务必保证「字段名 冒号/竖线 6 位十六进制色值」的模式完整大小写均可解析器对 hex 不区分大小写。二、Color Palette颜色体系的四个层级与无障碍基线主色Primary Colors主色是品牌识别度最高的颜色用于 CTA、页头、链接等关键元素。模板要求每行提供 Name、Hex、RGB、Usage 四列NameHexRGBUsage{Name}#{hex}rgb({r},{g},{b})Primary brand color, CTAs, headers{Name}#{hex}rgb({r},{g},{b})Supporting accent辅色Secondary Colors辅色起衬托与高亮作用数量控制在 23 个通常包含一个强调色accent。color-palette-management.md 给出的层级建议是Primary Colors (1-2) ├── Main brand color - Used for CTAs, headers, key elements └── Supporting primary - Secondary emphasis Secondary Colors (2-3) ├── Accent colors - Highlights, interactive states └── Supporting visuals - Icons, illustrations Neutral Palette (3-5) ├── Background colors - Page, card, modal backgrounds ├── Text colors - Headings, body, muted text └── UI elements - Borders, dividers, shadows Semantic Colors (4) ├── Success - #22C55E (green) ├── Warning - #F59E0B (amber) ├── Error - #EF4444 (red) └── Info - #3B82F6 (blue)中性色板Neutral Palette中性色是界面骨架模板固定了四行结构Background页面背景、Text Primary正文、Text Secondary说明/弱化文字、Border分隔线与边框。这四行在sync-brand-to-tokens.cjs之外虽不直接参与颜色尺度生成但被inject-brand-context.cjs的### Neutral区块正则捕获后汇入品牌调色板用于后续合规比对。无障碍基线Accessibility模板强制要求记录三组对比度数据这是品牌色「可发布」的硬门槛- Text/Background Contrast: {ratio}:1 (WCAG {level}) - CTA Contrast: {ratio}:1 - All interactive elements meet WCAG 2.1 AA参照 color-palette-management.md 的 WCAG 2.1 量化标准普通文本 AA 需 4.5:1、大文本/UI 组件 3:1AAA 级普通文本 7:1、大文本 4.5:1。starter 模板给出的实测值很有参考性#111827正文配白底对比度 7.2:1AAA主色#2563EB配白底 4.6:1AA。该参考文档还给出了相对亮度与对比度的 JavaScript 计算公式可在编写指南时自行验证function luminance(r, g, b) { const [rs, gs, bs] [r, g, b].map(v { v / 255; return v 0.03928 ? v / 12.92 : Math.pow((v 0.055) / 1.055, 2.4); }); return 0.2126 * rs 0.7152 * gs 0.0722 * bs; } function contrastRatio(l1, l2) { const lighter Math.max(l1, l2); const darker Math.min(l1, l2); return (lighter 0.05) / (darker 0.05); }另外两条实战禁忌同样出自 color-palette-management.md正文不要用纯黑#000000推荐#111827一类的深灰蓝也不要仅靠颜色传达语义——错误、成功等状态应同时配图标或文字。starter 模板为此专门增加了「Semantic Colors」区块Success#22C55E、Warning#F59E0B、Error#EF4444、Info#3B82F6这是对模板的可选扩展。三、Typography字体栈、字号阶梯与加载方式模板用 CSS 变量形式定义字体栈让字体信息可以直接被设计系统消费--font-heading: {Font}, sans-serif; --font-body: {Font}, sans-serif; --font-mono: {Font}, monospace;inject-brand-context.cjs的extractTypography正是通过正则匹配--font-heading:/--font-body:/--font-mono:来提取字体名的所以这三行变量名必须保持原样。starter 模板给出了完整回退栈示例--font-heading: Inter, system-ui, -apple-system, sans-serif; --font-body: Inter, system-ui, -apple-system, sans-serif; --font-mono: JetBrains Mono, Fira Code, monospace;字号阶梯Type Scale是模板中信息密度最高的表格它同时约束 Desktop 与 Mobile 两套尺寸保证响应式下的层级一致ElementFontWeightSize (Desktop/Mobile)Line HeightH1{font}70048px / 32px1.2H2{font}60036px / 28px1.25H3{font}60028px / 24px1.3H4{font}60024px / 20px1.35Body{font}40016px / 16px1.5Small{font}40014px / 14px1.5Caption{font}40012px / 12px1.4starter 模板在此基础上补充了Body Large 18px / 1.6一档并额外提供了字体加载的link预连接写法便于直接粘贴进 HTMLlink relpreconnect hrefhttps://fonts.googleapis.com link hrefhttps://fonts.googleapis.com/css2?familyInter:wght400;500;600;700displayswap relstylesheet四、Logo Usage变体、留白、最小尺寸与红线模板把 Logo 规范收敛为四类约束变体Variants——按使用场景划分四档带字标的完整横版Primary、方形空间用的竖排版Stacked、favicon 与应用图标用的纯符号版Icon、受限配色环境的单色版Monochrome。starter 模板进一步为每个变体指定了文件命名logo-full-horizontal.svg、logo-stacked.svg、logo-icon.svg、logo-mono.svg——这与validate-asset.cjs的命名校验规则一脉相承。留白Clear Space——模板给出极简规则Minimum clear space height of logo mark最小留白等于 Logo 图形本身的高度避免其他元素侵入 Logo 的可读区。最小尺寸Minimum Size——数字与印刷分开约束Digital: 80px width minimumPrint: 25mm width minimumstarter 模板给出了更细分的版本数字横版 120px、数字图标 24px、印刷横版 35mm、印刷图标 10mm品牌方可根据自身 Logo 复杂度调整。红线清单Donts——模板固定五条禁令任何品牌指南都应继承Dont rotate or skew禁止旋转或倾斜Dont change colors outside approved palette禁止使用批准调色板之外的配色Dont add effects (shadows, gradients)禁止添加阴影、渐变等特效Dont crop or modify proportions禁止裁切或篡改比例Dont place on busy backgrounds禁止放置在杂乱背景上这些规范最终会被validate-asset.cjs以「文件名 尺寸 格式 清单注册」的形式机器化执行因此模板中的logo.variants、logo.minSize字段在填写时越精确后续资产校验越可落地。五、Voice Tone声音人格、语境语调与禁用词声音规范决定「品牌如何说话」模板把它拆成四个可量化的部分品牌人格Brand Personality——用 23 个特质词各配一句描述例如 starter 模板的Professional: Expert knowledge, authoritative yet approachable。声音对照表Voice Chart——每个特质必须同时给出「We Are」与「We Are Not」通过反例限定边界TraitWe AreWe Are Not{Trait}{Description}{Anti-description}按语境调整语调Tone by Context——同一品牌在不同场景语气不同模板强制列出 Marketing / Support / Error Messages / Success 四类语境并各配一句示例文案ContextToneExampleMarketing{tone}{example}Support{tone}{example}Error Messages{tone}{example}Success{tone}{example}starter 模板的示例非常具体营销「Create campaigns that convert.」、文档「Run the command to start.」、报错「Try refreshing the page.」、成功「Campaign published!」。禁用词Prohibited Terms——每项都要注明禁用理由例如 starter 模板列出Revolutionary过度使用、Best-in-class模糊声明、Seamless过度使用、Synergy企业黑话、Leverage建议改用 use。这些词会被inject-brand-context.cjs的extractVoice提取进voice.prohibited数组最终注入到 AI 生成内容的系统提示词中从源头拦截不符合品牌语气的文案。六、Imagery Guidelines摄影、插画与图标的风格基线图像规范帮助 AI 图像生成与设计师对齐视觉语言模板覆盖三个层次摄影风格Photography Style光照偏好、主体规范、后期色调处理插画Illustrations风格描述、仅限品牌调色板、描边粗细{weight}px图标Icons风格outlined/filled/duotone 三选一、24px 基准网格、圆角值。starter 模板给出了可直接套用的实例摄影走自然柔和光、真实人物与场景插画为现代扁平风加微渐变、2px 统一描边、4px 圆角图标为 outline 风格、24px 网格、1.5px 描边、2px 圆角。它还额外扩展了「AI 图像生成」章节——Base Prompt 模板、风格关键词表光照/情绪/构图/处理/美学、视觉情绪描述词、视觉 Donts 表与示例提示词这套扩展能被inject-brand-context.cjs的extractImageStyle完整识别它逐一匹配Base Prompt Template、Style Keywords、Visual Mood Descriptors、Visual Donts、Example Prompts区块最终作为IMAGE GENERATION段注入提示词。七、从模板到工作流四步使用法与脚本联动模板末尾给出标准使用流程Copy template above—— 复制模板全文Fill in brand-specific values—— 填入品牌专属值Save asdocs/brand-guidelines.md—— 保存为指南文档Reference in content workflows—— 在内容工作流中引用在这四步之上ui-ux-pro-max-skill 的 brand 技能把「引用」升级为「机器可执行的品牌闭环」与模板配套的四个脚本各自消费模板的一个侧面1. 品牌上下文注入inject-brand-context.cjs解析docs/brand-guidelines.md提取颜色、字体、声音、图像风格输出一段可直接拼进 AI 系统提示词的BRAND CONTEXT文本--json模式输出结构化 JSON便于程序消费。node cli/assets/skills/brand/scripts/inject-brand-context.cjs node cli/assets/skills/brand/scripts/inject-brand-context.cjs --json2. 同步到设计令牌sync-brand-to-tokens.cjs把指南中的颜色按primary / secondary / accent三种角色提取出来生成 50900 的十档色阶写入design-tokens.json再调用 design-system 技能重新生成design-tokens.css。模板中的### Primary Colors等标题就是它的解析锚点——标签含dark的行归入深色档、含light的行归入浅色档其余首个颜色作为 base 色node cli/assets/skills/brand/scripts/sync-brand-to-tokens.cjs node cli/assets/skills/brand/scripts/sync-brand-to-tokens.cjs --dry-run--dry-run只预览将要写入的颜色尺度而不落盘适合正式同步前检查解析结果。注意它硬编码读取工作区根目录的docs/brand-guidelines.md与模板第 3 步的保存路径约定一致。3. 颜色合规校验extract-colors.cjs--palette模式直接打印指南中按主/辅/中性/语义分组的品牌调色板传入图片路径时生成 ImageMagick 提取指令并以 RGB 欧氏距离 ≤50 为阈值计算品牌合规百分比calculateCompliance。这让模板中的色值成为可执行的「品牌色白名单」。node cli/assets/skills/brand/scripts/extract-colors.cjs --palette node cli/assets/skills/brand/scripts/extract-colors.cjs image-path --brand-file docs/brand-guidelines.md4. 资产命名与尺寸校验validate-asset.cjs按{type}_{campaign}_{description}_{timestamp}_{variant}.{ext}命名约定校验营销资产的命名、格式、尺寸与文件大小并检查是否注册进.assets/manifest.json。它对图片默认限 5MB推荐 1MB、SVG 限 500KB未达标时给出建议文件名node cli/assets/skills/brand/scripts/validate-asset.cjs asset-path node cli/assets/skills/brand/scripts/validate-asset.cjs asset-path --json【免费下载链接】ui-ux-pro-max-skillAn AI skill that provides design intelligence for building professional UI/UX across multiple platforms.项目地址: https://gitcode.com/gh_mirrors/ui/ui-ux-pro-max-skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考