HeyGen AI Video 视觉风格深度解析OpenMontage 中 visual-style.md 设计系统的定义、提取与跨工具应用【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage在 OpenMontage开源 agentic 视频制作系统中视觉风格的工程化是通过visual-style.md文件实现的——一个用 Markdown YAML frontmatter 定义的、任何 AI 工具都能消费的便携式设计系统。本文以仓库中的 HeyGen AI Video 风格文件 为剖析对象完整拆解其配色、字体、布局、动效、氛围的规格定义方式讲解该风格如何通过 Connectors 落地到 HeyGen Video Agent、HTML Slides、paper.design 与 Figma 四种工具并结合仓库中真实的 HeyGen 视频生成工具源码给出从风格文件到AI 视频提示词的完整实战链路。读完本文你将掌握 visual-style.md 格式的字段规范、HeyGen 现代 AI/SaaS 风格的具体设计参数以及如何用一套风格文件驱动多种下游工具的生成。一、背景visual-style.md 是什么在深入具体风格之前先明确其承载格式。OpenMontage 的 visual-style 技能 定义了一种可移植的视觉设计系统文件格式一个visual-style.md文件用一段 YAML frontmatter 定义色彩colors、字体typography、布局layout、动效motion与氛围mood任何一个 AI 工具都能读取并消费它。该技能提供四种工作模式模式触发方式作用CreateCreate a visual-style.md for...通过引导式提问从零构建风格ExtractExtract a visual-style.md from [URL/image/video]分析来源并生成风格文件ApplyApply this visual-style.md to [tool]使用指定 Connector 将风格应用到工具GalleryShow me available visual styles浏览与使用预制风格Gallery 目录references/gallery/目前收录了五种预制风格Müller-Brockmann Swiss1950s–70s、Neville Brody Industrial1980s–90s、Saul Bass Cinematic1950s–60s、Game Boy Color1998–2003以及本文主角 HeyGen AI Video2020s。根据 格式规范 spec.mdvisual-style.md的核心设计理念有三条人类可读任何文本编辑器都能读懂、AI 可消费每个字段都能直接被 AI 模型使用、可移植适用于任何读取该格式的工具。其中必填字段只有五个name、version、style_prompt_short、style_prompt_full以及至少包含两个颜色对象的colors.primary。style_prompt_full是国王字段——如果工具只能读一个字段就读它其余字段是给需要更细粒度控制的工具用的结构化数据。二、风格总览style_prompt 双字段HeyGen AI Video 风格文件以style_prompt_short和style_prompt_full两个字段定义整体气质。前者是 1-2 句的电梯演讲后者是可直接独立使用的完整生成提示词。style_prompt_short摘要Vibrant AI-forward design. Cyan-to-pink gradient energy on clean white. Approachable tech that feels premium without being cold. 充满活力的 AI 前沿设计。纯净白底上青到粉的渐变能量。亲切的技术感高级但不冰冷。style_prompt_full完整提示词Modern AI video platform aesthetic inspired by HeyGen. Clean white backgrounds with generous whitespace. Signature cyan-pink gradient (#00C3FF to #95AAFE to #FEA5FE) as the hero visual element. Primary accent is Hey Blue (#00C3FF) for CTAs and interactive elements. Prism Pink (#F3A6FF) as secondary accent for emphasis and warmth. Typography uses geometric sans-serifs (ABC Solar, TT Norms Pro, or similar) with clear hierarchy. Large rounded corners (12-48px) on cards and buttons. Smooth fade-in animations and subtle hover transitions. Tech-forward but approachable — innovation meets accessibility. Avoid harsh corporate blue, avoid dark mode unless specifically requested, avoid overly complex gradients or 3D effects. 受 HeyGen 启发的现代 AI 视频平台美学。干净白色背景配充裕留白。标志性的青粉渐变#00C3FF → #95AAFE → #FEA5FE作为主角视觉元素。主强调色为 Hey Blue#00C3FF用于 CTA 与交互元素。Prism Pink#F3A6FF作为次级强调色用于强调与温暖感。字体采用几何无衬线体ABC Solar、TT Norms Pro 或同类层级清晰。卡片与按钮使用大圆角12-48px。流畅的淡入动画与微妙的悬停过渡。技术前沿但平易近人——创新与可及性并存。避免生硬的商务蓝除非明确要求否则避免暗色模式避免过于复杂的渐变或 3D 效果。注意style_prompt_full的写作技巧既明确要做什么clean white、cyan-pink gradient、geometric sans-serifs也明确不要做什么avoid harsh corporate blue、avoid dark mode、avoid complex 3D effects。这与 spec.md 中负面约束与正面约束同等重要的设计决策一致——告诉 AI不要做什么往往比要做什么更有效。三、色彩系统从纯白画布到青粉渐变HeyGen AI Video 风格定义了 8 个颜色对象分为 primary主色、accent强调色、neutral中性色三层。每个颜色对象都遵循统一的 schemaname描述性名称、hex十六进制色值、role在系统中的作用。Primary主色名称色值作用Pure White#FFFFFF主背景、干净画布Carbon#333333主文字、标题Accent强调色名称色值作用Hey Blue#00C3FFCTA、链接、主品牌强调Prism Pink#F3A6FF次级强调、渐变端点、点缀Gen Green#35C838成功状态、正向反馈Neutral中性色名称色值作用Mist#F2F2F2区块背景、卡片Cloud#D9D9D9边框、分隔线Deep Teal#033337深色背景、页脚、对比区块这套色彩体系的设计逻辑清晰可循白色承担 90% 的画布职责Carbon 承担可读性Hey Blue 与 Prism Pink 构成标志性的青粉渐变#00C3FF → #95AAFE → #FEA5FE作为主角视觉元素Gen Green 只服务于成功反馈。色彩被有节制地使用——渐变是hero要大胆地用但要克制地量use it sparingly but boldly。在文件的扩展命名空间x_heygen中还保存了可直接复制的渐变定义x_heygen: brand_gradient: linear-gradient(328deg, #00c3ff, #95aafe 50%, #fea5fe) orientation: landscapex_*前缀是格式规范中的扩展机制允许不同工具保存自己的专属配置而不污染核心 schema例如x_heygen、x_figma、x_paper。这里的brand_gradient是 328° 方向的线性渐变orientation: landscape则锁定了横屏取向。四、字体系统几何无衬线的清晰层级typography 字段定义了 display展示、body正文、caption说明三层字体以及四条约束规则。层级字体族字重样式displayABC Solar, TT Norms Pro, system-ui700-800大号、自信、宽松字距bodyTT Norms Pro, system-ui, sans-serif400-500舒适阅读18px 基准captionTT Norms Pro, system-ui, sans-serif50014-15px中等字重标签规则rules字号阶梯80px → 60px → 44px → 32px → 24px → 18px → 14px充足的行高以保可读性UI 元素用中等字重500-600粗体700-800仅用于标题这套字号阶梯与 Connectors 中的 Figma 映射Text styles following the 80-60-44-32-24-18-14px scale完全对应说明字体系统的定义目标是一份定义、多端一致——无论落到视频标题还是设计稿层级关系保持不变。五、布局与动效4px 基础网格与从容的动效布局系统layout: grid: 12 columns, max-width 1200px, flex-based alignment: Center-aligned sections, left-aligned content aspect_ratio: 16:9 for video content, varied for features notes: - 4px base spacing unit (8, 16, 24, 32, 40, 60, 80px scale) - Large rounded corners: 12px cards, 20px buttons, 48px hero elements - Generous padding: 16-24px internal, 60-120px section gaps - Cards with subtle borders, minimal shadows布局要点可以概括为三个数字语言12 列网格 1200px 最大宽度 4px 基准间距。间距全部落在 4px 的整数倍上8/16/24/32/40/60/80圆角按组件规模分层12px 卡片、20px 按钮、48px hero 元素内边距 16-24px、区块间隔 60-120px。值得注意的是subtle borders, minimal shadows——用细边框替代重阴影这与 paper.design Connector 中避免重阴影改用微细边框的指引互相印证。动效系统motion: transitions: - fadeInUp (300ms) for content reveals - slideDown (250ms) for dropdowns - smooth hover transitions (150-200ms) animation_style: Smooth and modern. Elements fade and slide in gracefully. Subtle scale effects on hover. Nothing bouncy or playful — confident and professional with a touch of polish. pacing: Quick, responsive, modern feel audio_cues: - electronic ambient - modern corporate - upbeat but professional动效定义了精确的时间参数内容揭示用 fadeInUp 300ms、下拉用 slideDown 250ms、悬停过渡 150-200ms。animation_style明确排除了bouncy or playful弹跳或俏皮追求自信专业 一点精致confident and professional with a touch of polish。音频线索也一并定义电子环境音、现代商务、轻快但专业。六、氛围基调与设计原则mood 字段用关键词锁定风格气质并给出明确的反模式清单字段内容keywordsinnovative、approachable、premium、modern、creative、tech-forwardera2020s AI/SaaScultural_referenceModern AI tools, creative tech platforms, Figma/Notion energyavoid生硬商务蓝、暗色笨重界面、过度复杂 3D 效果、图库摄影感、杂乱布局、局促小字号文件正文的Design Principles设计原则部分给出了四条风格哲学AI should feel accessible, not intimidating.AI 应当亲切可及而非令人生畏。White space communicates premium quality.留白传达高级质感。The cyan-pink gradient is the hero — use it sparingly but boldly.青粉渐变是主角——用得克制但大胆。Every interaction should feel smooth and responsive.每个交互都应当顺滑且响应及时。mood.avoid 的价值在 spec.md 中被单独解释负面约束negative constraints与正面约束同样重要告诉 AI 不该做什么往往比告诉它该做什么更有效。七、来源与提取记录文件正文的Extraction Notes记录了该风格的来源与提取方式Extracted from https://heygen.com on 2026-03-12. Primary colors sampled from CSS variables and brand guidelines. Typography identified via computed styles (ABC Solar, TT Norms Pro). Gradient extracted from hero sections and brand elements. Spacing system follows 4px base unit pattern.这说明该风格并非凭空虚构而是从 HeyGen 官网提取的真实品牌风格主色来自 CSS 变量与品牌规范采样、字体通过计算样式识别、渐变取自 hero 区块、间距遵循 4px 基准单位。提取流程与 visual-style 技能 中定义的 Extract 模式完全对应——接收 URL/图片/视频/PDF 来源通过 extractors/from-website.md、from-video.md、from-pdf.md 三类提取器分析色彩、字体、布局、动效、氛围最后输出带source_url的完整visual-style.md。八、Connectors一份风格、四种工具落地风格文件的正文最后一部分是Connectors定义了如何将该风格翻译到不同下游工具。HeyGen Video AgentAI 视频生成Use the signature gradient as background or overlay element. Hey Blue for text emphasis and CTAs. Clean white backgrounds. Modern, confident pacing. Approachable AI energy. 将标志性渐变用作背景或叠加元素。Hey Blue 用于文字强调与 CTA。干净白色背景。现代、自信的节奏。亲切的 AI 能量。落地方式将style_prompt_full原样作为视觉风格块拼接进生成提示词。HTML Slides网页演示文稿White backgrounds with gradient accent strips or hero elements. Large rounded corners on cards. Generous whitespace. Hey Blue for interactive elements, Prism Pink for highlights. 白色背景配渐变强调条或 hero 元素。卡片大圆角。充裕留白。Hey Blue 用于交互元素Prism Pink 用于高亮。paper.design设计文档Clean layouts with the gradient as a bold accent element. Large typography with clear hierarchy. Rounded card patterns. Avoid heavy shadows — use subtle borders instead. 干净布局渐变作为大胆强调元素。大字号清晰层级。圆角卡片模式。避免重阴影——改用微细边框。Figma设计工具Color styles:brand/hey-blue,brand/prism-pink,brand/gradient. Text styles following the 80-60-44-32-24-18-14px scale. Component variants with large border-radius (12-48px). 颜色样式brand/hey-blue、brand/prism-pink、brand/gradient。文本样式遵循 80-60-44-32-24-18-14px 字号阶梯。组件变体使用 12-48px 大圆角。可以看到 Connectors 部分输出的不是泛泛而谈而是每个工具各自的语言给 HeyGen 的是生成提示词要点给 HTML Slides 的是 CSS 映射逻辑给 Figma 的是具体的 style token 命名brand/hey-blue与字号阶梯。九、实战构造一份 HeyGen 视频生成提示词HeyGen Video Agent Connector 提供了字段到工具的精确映射表visual-style.md 字段HeyGen 中的用法style_prompt_full原样追加到生成提示词motion.transitions场景转场指令motion.animation_style动画行为motion.pacing节奏指导typography.caption字幕样式若开启字幕layout.aspect_ratio画幅设置16:9 横屏、9:16 竖屏mood.avoid负面提示词 / 排除指令assets.gsep_elements叠加素材若支持x_heygen.orientation显式画幅覆盖x_heygen.video_id引用已有 HeyGen 视频基于标准提示词模板将本风格完整嵌入后一份可直接投入使用的提示词如下Create a video about [TOPIC]. Script: [USERS SCRIPT] Visual style: Modern AI video platform aesthetic inspired by HeyGen. Clean white backgrounds with generous whitespace. Signature cyan-pink gradient (#00C3FF to #95AAFE to #FEA5FE) as the hero visual element. Primary accent is Hey Blue (#00C3FF) for CTAs and interactive elements. Prism Pink (#F3A6FF) as secondary accent for emphasis and warmth. Typography uses geometric sans-serifs (ABC Solar, TT Norms Pro, or similar) with clear hierarchy. Large rounded corners (12-48px) on cards and buttons. Smooth fade-in animations and subtle hover transitions. Tech-forward but approachable — innovation meets accessibility. Avoid harsh corporate blue, avoid dark mode unless specifically requested, avoid overly complex gradients or 3D effects. Additional constraints: - No avatar - No b-roll footage - Pure motion graphics only Motion: - Transitions: fadeInUp (300ms) for content reveals - Pacing: Quick, responsive, modern feel - Animation: Smooth and modern, elements fade and slide in gracefully Format: landscape (16:9)Connector 文档中的 Tips 还提供了三条提升效果的经验明确说出不想要什么HeyGen 对负面约束响应良好运动图形模式下追加 No avatar. No b-roll. Pure motion graphics.数据密集型内容中主动提及 animated charts, counters, data viz。十、仓库中的 HeyGen 工具支撑从风格到成片的 API 层visual-style 文件定义了视觉语言而 OpenMontage 仓库中的 heygen_video.py 则提供了将这种语言落到实际视频生成调用的工具层。从源码可以看到HeyGenVideo工具类name heygen_video版本 0.1.0属于 GENERATE 层级的 API 运行时工具能力标记为text_to_video、image_to_video、provider_selection支持参考图输入reference_image: True工具通过HEYGEN_API_KEY环境变量激活未设置时get_status()返回 UNAVAILABLE并提示去 HeyGen 后台获取密钥输入参数与视觉风格的衔接点清晰可见aspect_ratio枚举[16:9, 9:16, 1:1]默认 16:9正好对应layout.aspect_ratio/x_heygen.orientation字段provider_variant可切换底层视频生成服务商工具声明了降级链fallback wan_video备用工具包含wan_video、hunyuan_video、ltx_video_local、cogvideo_video、ltx_video_modal、image_selector——即 HeyGen 不可用时自动切到本地或云端替代方案。底层的 _shared.py 中可以看到完整的调用链实现generate_heygen_video()负责组装请求必要时先经upload_image_heygen()上传参考图提交到 HeyGen 工作流执行接口后由poll_heygen(execution_id, api_key, timeout600)以 600 秒超时轮询执行结果最终下载视频到output_path。这构成了完整的三层链路visual-style.md 定义风格 → Connector 翻译为提示词 → heygen_video 工具执行生成。风格文件在前端约束长什么样工具层在后端负责怎么生成二者通过aspect_ratio、orientation等字段精确对齐。十一、最佳实践小结综合 SKILL.md、spec.md 与本文风格文件本身使用 visual-style.md 有六条最佳实践style_prompt_full是国王——它必须始终能作为独立生成提示词使用即使不解析结构化字段的工具也能直接消费一风格一文件——不搞多风格混装资源一律用 URL——绝不内嵌二进制数据保持文件小巧、可版本化、可移植展示而非描述——创建风格时生成 HTML 色板预览或可视化结果有主见的默认值 灵活的扩展——核心 schema 固定x_*命名空间承载工具专属配置负面约束同样重要——mood.avoid与正面描述一起写入提示词往往效果更好。对于 HeyGen AI Video 这一风格还有一条特有的使用提醒渐变是主角但要用得克制而大胆use it sparingly but boldly——这正是整个设计系统的气质内核。【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
HeyGen AI Video 视觉风格深度解析：OpenMontage 中 visual-style.md 设计系统的定义、提取与跨工具应用
HeyGen AI Video 视觉风格深度解析OpenMontage 中 visual-style.md 设计系统的定义、提取与跨工具应用【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage在 OpenMontage开源 agentic 视频制作系统中视觉风格的工程化是通过visual-style.md文件实现的——一个用 Markdown YAML frontmatter 定义的、任何 AI 工具都能消费的便携式设计系统。本文以仓库中的 HeyGen AI Video 风格文件 为剖析对象完整拆解其配色、字体、布局、动效、氛围的规格定义方式讲解该风格如何通过 Connectors 落地到 HeyGen Video Agent、HTML Slides、paper.design 与 Figma 四种工具并结合仓库中真实的 HeyGen 视频生成工具源码给出从风格文件到AI 视频提示词的完整实战链路。读完本文你将掌握 visual-style.md 格式的字段规范、HeyGen 现代 AI/SaaS 风格的具体设计参数以及如何用一套风格文件驱动多种下游工具的生成。一、背景visual-style.md 是什么在深入具体风格之前先明确其承载格式。OpenMontage 的 visual-style 技能 定义了一种可移植的视觉设计系统文件格式一个visual-style.md文件用一段 YAML frontmatter 定义色彩colors、字体typography、布局layout、动效motion与氛围mood任何一个 AI 工具都能读取并消费它。该技能提供四种工作模式模式触发方式作用CreateCreate a visual-style.md for...通过引导式提问从零构建风格ExtractExtract a visual-style.md from [URL/image/video]分析来源并生成风格文件ApplyApply this visual-style.md to [tool]使用指定 Connector 将风格应用到工具GalleryShow me available visual styles浏览与使用预制风格Gallery 目录references/gallery/目前收录了五种预制风格Müller-Brockmann Swiss1950s–70s、Neville Brody Industrial1980s–90s、Saul Bass Cinematic1950s–60s、Game Boy Color1998–2003以及本文主角 HeyGen AI Video2020s。根据 格式规范 spec.mdvisual-style.md的核心设计理念有三条人类可读任何文本编辑器都能读懂、AI 可消费每个字段都能直接被 AI 模型使用、可移植适用于任何读取该格式的工具。其中必填字段只有五个name、version、style_prompt_short、style_prompt_full以及至少包含两个颜色对象的colors.primary。style_prompt_full是国王字段——如果工具只能读一个字段就读它其余字段是给需要更细粒度控制的工具用的结构化数据。二、风格总览style_prompt 双字段HeyGen AI Video 风格文件以style_prompt_short和style_prompt_full两个字段定义整体气质。前者是 1-2 句的电梯演讲后者是可直接独立使用的完整生成提示词。style_prompt_short摘要Vibrant AI-forward design. Cyan-to-pink gradient energy on clean white. Approachable tech that feels premium without being cold. 充满活力的 AI 前沿设计。纯净白底上青到粉的渐变能量。亲切的技术感高级但不冰冷。style_prompt_full完整提示词Modern AI video platform aesthetic inspired by HeyGen. Clean white backgrounds with generous whitespace. Signature cyan-pink gradient (#00C3FF to #95AAFE to #FEA5FE) as the hero visual element. Primary accent is Hey Blue (#00C3FF) for CTAs and interactive elements. Prism Pink (#F3A6FF) as secondary accent for emphasis and warmth. Typography uses geometric sans-serifs (ABC Solar, TT Norms Pro, or similar) with clear hierarchy. Large rounded corners (12-48px) on cards and buttons. Smooth fade-in animations and subtle hover transitions. Tech-forward but approachable — innovation meets accessibility. Avoid harsh corporate blue, avoid dark mode unless specifically requested, avoid overly complex gradients or 3D effects. 受 HeyGen 启发的现代 AI 视频平台美学。干净白色背景配充裕留白。标志性的青粉渐变#00C3FF → #95AAFE → #FEA5FE作为主角视觉元素。主强调色为 Hey Blue#00C3FF用于 CTA 与交互元素。Prism Pink#F3A6FF作为次级强调色用于强调与温暖感。字体采用几何无衬线体ABC Solar、TT Norms Pro 或同类层级清晰。卡片与按钮使用大圆角12-48px。流畅的淡入动画与微妙的悬停过渡。技术前沿但平易近人——创新与可及性并存。避免生硬的商务蓝除非明确要求否则避免暗色模式避免过于复杂的渐变或 3D 效果。注意style_prompt_full的写作技巧既明确要做什么clean white、cyan-pink gradient、geometric sans-serifs也明确不要做什么avoid harsh corporate blue、avoid dark mode、avoid complex 3D effects。这与 spec.md 中负面约束与正面约束同等重要的设计决策一致——告诉 AI不要做什么往往比要做什么更有效。三、色彩系统从纯白画布到青粉渐变HeyGen AI Video 风格定义了 8 个颜色对象分为 primary主色、accent强调色、neutral中性色三层。每个颜色对象都遵循统一的 schemaname描述性名称、hex十六进制色值、role在系统中的作用。Primary主色名称色值作用Pure White#FFFFFF主背景、干净画布Carbon#333333主文字、标题Accent强调色名称色值作用Hey Blue#00C3FFCTA、链接、主品牌强调Prism Pink#F3A6FF次级强调、渐变端点、点缀Gen Green#35C838成功状态、正向反馈Neutral中性色名称色值作用Mist#F2F2F2区块背景、卡片Cloud#D9D9D9边框、分隔线Deep Teal#033337深色背景、页脚、对比区块这套色彩体系的设计逻辑清晰可循白色承担 90% 的画布职责Carbon 承担可读性Hey Blue 与 Prism Pink 构成标志性的青粉渐变#00C3FF → #95AAFE → #FEA5FE作为主角视觉元素Gen Green 只服务于成功反馈。色彩被有节制地使用——渐变是hero要大胆地用但要克制地量use it sparingly but boldly。在文件的扩展命名空间x_heygen中还保存了可直接复制的渐变定义x_heygen: brand_gradient: linear-gradient(328deg, #00c3ff, #95aafe 50%, #fea5fe) orientation: landscapex_*前缀是格式规范中的扩展机制允许不同工具保存自己的专属配置而不污染核心 schema例如x_heygen、x_figma、x_paper。这里的brand_gradient是 328° 方向的线性渐变orientation: landscape则锁定了横屏取向。四、字体系统几何无衬线的清晰层级typography 字段定义了 display展示、body正文、caption说明三层字体以及四条约束规则。层级字体族字重样式displayABC Solar, TT Norms Pro, system-ui700-800大号、自信、宽松字距bodyTT Norms Pro, system-ui, sans-serif400-500舒适阅读18px 基准captionTT Norms Pro, system-ui, sans-serif50014-15px中等字重标签规则rules字号阶梯80px → 60px → 44px → 32px → 24px → 18px → 14px充足的行高以保可读性UI 元素用中等字重500-600粗体700-800仅用于标题这套字号阶梯与 Connectors 中的 Figma 映射Text styles following the 80-60-44-32-24-18-14px scale完全对应说明字体系统的定义目标是一份定义、多端一致——无论落到视频标题还是设计稿层级关系保持不变。五、布局与动效4px 基础网格与从容的动效布局系统layout: grid: 12 columns, max-width 1200px, flex-based alignment: Center-aligned sections, left-aligned content aspect_ratio: 16:9 for video content, varied for features notes: - 4px base spacing unit (8, 16, 24, 32, 40, 60, 80px scale) - Large rounded corners: 12px cards, 20px buttons, 48px hero elements - Generous padding: 16-24px internal, 60-120px section gaps - Cards with subtle borders, minimal shadows布局要点可以概括为三个数字语言12 列网格 1200px 最大宽度 4px 基准间距。间距全部落在 4px 的整数倍上8/16/24/32/40/60/80圆角按组件规模分层12px 卡片、20px 按钮、48px hero 元素内边距 16-24px、区块间隔 60-120px。值得注意的是subtle borders, minimal shadows——用细边框替代重阴影这与 paper.design Connector 中避免重阴影改用微细边框的指引互相印证。动效系统motion: transitions: - fadeInUp (300ms) for content reveals - slideDown (250ms) for dropdowns - smooth hover transitions (150-200ms) animation_style: Smooth and modern. Elements fade and slide in gracefully. Subtle scale effects on hover. Nothing bouncy or playful — confident and professional with a touch of polish. pacing: Quick, responsive, modern feel audio_cues: - electronic ambient - modern corporate - upbeat but professional动效定义了精确的时间参数内容揭示用 fadeInUp 300ms、下拉用 slideDown 250ms、悬停过渡 150-200ms。animation_style明确排除了bouncy or playful弹跳或俏皮追求自信专业 一点精致confident and professional with a touch of polish。音频线索也一并定义电子环境音、现代商务、轻快但专业。六、氛围基调与设计原则mood 字段用关键词锁定风格气质并给出明确的反模式清单字段内容keywordsinnovative、approachable、premium、modern、creative、tech-forwardera2020s AI/SaaScultural_referenceModern AI tools, creative tech platforms, Figma/Notion energyavoid生硬商务蓝、暗色笨重界面、过度复杂 3D 效果、图库摄影感、杂乱布局、局促小字号文件正文的Design Principles设计原则部分给出了四条风格哲学AI should feel accessible, not intimidating.AI 应当亲切可及而非令人生畏。White space communicates premium quality.留白传达高级质感。The cyan-pink gradient is the hero — use it sparingly but boldly.青粉渐变是主角——用得克制但大胆。Every interaction should feel smooth and responsive.每个交互都应当顺滑且响应及时。mood.avoid 的价值在 spec.md 中被单独解释负面约束negative constraints与正面约束同样重要告诉 AI 不该做什么往往比告诉它该做什么更有效。七、来源与提取记录文件正文的Extraction Notes记录了该风格的来源与提取方式Extracted from https://heygen.com on 2026-03-12. Primary colors sampled from CSS variables and brand guidelines. Typography identified via computed styles (ABC Solar, TT Norms Pro). Gradient extracted from hero sections and brand elements. Spacing system follows 4px base unit pattern.这说明该风格并非凭空虚构而是从 HeyGen 官网提取的真实品牌风格主色来自 CSS 变量与品牌规范采样、字体通过计算样式识别、渐变取自 hero 区块、间距遵循 4px 基准单位。提取流程与 visual-style 技能 中定义的 Extract 模式完全对应——接收 URL/图片/视频/PDF 来源通过 extractors/from-website.md、from-video.md、from-pdf.md 三类提取器分析色彩、字体、布局、动效、氛围最后输出带source_url的完整visual-style.md。八、Connectors一份风格、四种工具落地风格文件的正文最后一部分是Connectors定义了如何将该风格翻译到不同下游工具。HeyGen Video AgentAI 视频生成Use the signature gradient as background or overlay element. Hey Blue for text emphasis and CTAs. Clean white backgrounds. Modern, confident pacing. Approachable AI energy. 将标志性渐变用作背景或叠加元素。Hey Blue 用于文字强调与 CTA。干净白色背景。现代、自信的节奏。亲切的 AI 能量。落地方式将style_prompt_full原样作为视觉风格块拼接进生成提示词。HTML Slides网页演示文稿White backgrounds with gradient accent strips or hero elements. Large rounded corners on cards. Generous whitespace. Hey Blue for interactive elements, Prism Pink for highlights. 白色背景配渐变强调条或 hero 元素。卡片大圆角。充裕留白。Hey Blue 用于交互元素Prism Pink 用于高亮。paper.design设计文档Clean layouts with the gradient as a bold accent element. Large typography with clear hierarchy. Rounded card patterns. Avoid heavy shadows — use subtle borders instead. 干净布局渐变作为大胆强调元素。大字号清晰层级。圆角卡片模式。避免重阴影——改用微细边框。Figma设计工具Color styles:brand/hey-blue,brand/prism-pink,brand/gradient. Text styles following the 80-60-44-32-24-18-14px scale. Component variants with large border-radius (12-48px). 颜色样式brand/hey-blue、brand/prism-pink、brand/gradient。文本样式遵循 80-60-44-32-24-18-14px 字号阶梯。组件变体使用 12-48px 大圆角。可以看到 Connectors 部分输出的不是泛泛而谈而是每个工具各自的语言给 HeyGen 的是生成提示词要点给 HTML Slides 的是 CSS 映射逻辑给 Figma 的是具体的 style token 命名brand/hey-blue与字号阶梯。九、实战构造一份 HeyGen 视频生成提示词HeyGen Video Agent Connector 提供了字段到工具的精确映射表visual-style.md 字段HeyGen 中的用法style_prompt_full原样追加到生成提示词motion.transitions场景转场指令motion.animation_style动画行为motion.pacing节奏指导typography.caption字幕样式若开启字幕layout.aspect_ratio画幅设置16:9 横屏、9:16 竖屏mood.avoid负面提示词 / 排除指令assets.gsep_elements叠加素材若支持x_heygen.orientation显式画幅覆盖x_heygen.video_id引用已有 HeyGen 视频基于标准提示词模板将本风格完整嵌入后一份可直接投入使用的提示词如下Create a video about [TOPIC]. Script: [USERS SCRIPT] Visual style: Modern AI video platform aesthetic inspired by HeyGen. Clean white backgrounds with generous whitespace. Signature cyan-pink gradient (#00C3FF to #95AAFE to #FEA5FE) as the hero visual element. Primary accent is Hey Blue (#00C3FF) for CTAs and interactive elements. Prism Pink (#F3A6FF) as secondary accent for emphasis and warmth. Typography uses geometric sans-serifs (ABC Solar, TT Norms Pro, or similar) with clear hierarchy. Large rounded corners (12-48px) on cards and buttons. Smooth fade-in animations and subtle hover transitions. Tech-forward but approachable — innovation meets accessibility. Avoid harsh corporate blue, avoid dark mode unless specifically requested, avoid overly complex gradients or 3D effects. Additional constraints: - No avatar - No b-roll footage - Pure motion graphics only Motion: - Transitions: fadeInUp (300ms) for content reveals - Pacing: Quick, responsive, modern feel - Animation: Smooth and modern, elements fade and slide in gracefully Format: landscape (16:9)Connector 文档中的 Tips 还提供了三条提升效果的经验明确说出不想要什么HeyGen 对负面约束响应良好运动图形模式下追加 No avatar. No b-roll. Pure motion graphics.数据密集型内容中主动提及 animated charts, counters, data viz。十、仓库中的 HeyGen 工具支撑从风格到成片的 API 层visual-style 文件定义了视觉语言而 OpenMontage 仓库中的 heygen_video.py 则提供了将这种语言落到实际视频生成调用的工具层。从源码可以看到HeyGenVideo工具类name heygen_video版本 0.1.0属于 GENERATE 层级的 API 运行时工具能力标记为text_to_video、image_to_video、provider_selection支持参考图输入reference_image: True工具通过HEYGEN_API_KEY环境变量激活未设置时get_status()返回 UNAVAILABLE并提示去 HeyGen 后台获取密钥输入参数与视觉风格的衔接点清晰可见aspect_ratio枚举[16:9, 9:16, 1:1]默认 16:9正好对应layout.aspect_ratio/x_heygen.orientation字段provider_variant可切换底层视频生成服务商工具声明了降级链fallback wan_video备用工具包含wan_video、hunyuan_video、ltx_video_local、cogvideo_video、ltx_video_modal、image_selector——即 HeyGen 不可用时自动切到本地或云端替代方案。底层的 _shared.py 中可以看到完整的调用链实现generate_heygen_video()负责组装请求必要时先经upload_image_heygen()上传参考图提交到 HeyGen 工作流执行接口后由poll_heygen(execution_id, api_key, timeout600)以 600 秒超时轮询执行结果最终下载视频到output_path。这构成了完整的三层链路visual-style.md 定义风格 → Connector 翻译为提示词 → heygen_video 工具执行生成。风格文件在前端约束长什么样工具层在后端负责怎么生成二者通过aspect_ratio、orientation等字段精确对齐。十一、最佳实践小结综合 SKILL.md、spec.md 与本文风格文件本身使用 visual-style.md 有六条最佳实践style_prompt_full是国王——它必须始终能作为独立生成提示词使用即使不解析结构化字段的工具也能直接消费一风格一文件——不搞多风格混装资源一律用 URL——绝不内嵌二进制数据保持文件小巧、可版本化、可移植展示而非描述——创建风格时生成 HTML 色板预览或可视化结果有主见的默认值 灵活的扩展——核心 schema 固定x_*命名空间承载工具专属配置负面约束同样重要——mood.avoid与正面描述一起写入提示词往往效果更好。对于 HeyGen AI Video 这一风格还有一条特有的使用提醒渐变是主角但要用得克制而大胆use it sparingly but boldly——这正是整个设计系统的气质内核。【免费下载链接】OpenMontageWorlds first open-source, agentic video production system. 12 production pipelines, 100 tools, 700 agent skill and production-knowledge files. Turn your AI coding assistant into a full video production studio.项目地址: https://gitcode.com/GitHub_Trending/op/OpenMontage创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
