baoyu-infographic kawaii 风格完全指南：日系可爱风信息图的配色、元素与提示词工程

AI 技能AI 插件【免费下载链接】baoyu-skills项目地址https://gitcode.com/gh_mirrors/ba/baoyu-skills点击查看免费下载导读本文聚焦 baoyu-infographic 技能内置的kawaii日系可爱风视觉风格系统拆解其官方风格定义中的色板、视觉元素、排版规范与适用场景并结合仓库源码提示词模板、样式画廊、图片生成后端与 EXTEND.md 偏好机制给出可复制的落地配置与调用方式。读完本文你将能够在 baoyu-infographic 的信息图工作流中稳定复现「大眼睛 马卡龙色 圆润造型」的日系可爱风信息图并理解这一风格在底层提示词中是如何被注入与控制的。kawaii 风格在 baoyu-infographic 中的定位baoyu-infographic 将信息图生成拆分为两个正交维度layout信息结构× style视觉美学任意布局都可以与任意风格自由组合。在 SKILL.md 的Style Gallery22 种风格中kawaii的官方描述为Japanese cute, pastels —— 日系可爱风柔和粉彩色调它与craft-handmade手绘纸艺、storybook-watercolor故事书水彩、claymation黏土定格同属「亲和治愈系」风格阵营但 kawaii 的核心识别特征是以角色造型与甜感色彩取胜而不是依赖纸纹、水渍或黏土质感。完整风格定义位于 styles/kawaii.md。从技能的数据模型看风格定义会被注入 Step 5 的最终提示词references/base-prompt.mdbase-prompt.md中明确预留了{{STYLE}}与{{STYLE_GUIDELINES}}两个占位符Step 5 组装提示词时会把references/styles/kawaii.md的内容拼接到Style Guidelines区段。因此kawaii.md 中的每一行规范最终都会以提示词指令的形式直接进入图像生成模型。色彩体系马卡龙色板与搭配规则kawaii 风格的颜色体系在原文档中被划分为三个层级Primary主色 —— 柔和粉彩三原色色彩十六进制色值观感Pink粉#FFB6C1甜而不腻的浅粉Mint薄荷#98D8C8清爽低饱和的薄荷绿Lavender薰衣草紫#E6E6FA梦幻柔和的淡紫这三色共同构成画面的主旋律。注意它们的共同特征是高明度、低饱和——即俗称的马卡龙色。任何过浓、过艳的版本如正红#FF0000、宝蓝都会破坏可爱氛围属于该风格下的「禁用色感」。Background背景 —— 浅粉或奶油底 闪光覆盖背景层使用light pink浅粉或 cream奶油白作为画布底色并叠加sparkle overlays闪光/星星光晕覆盖层。在截图示例 kawaii.webp 中可以看到淡紫色渐变底面上散布着星星、爱心与云朵正是「底色 闪光点缀」这一规则的实际呈现。Accents点缀色 —— 亮色跳点 星形爱心图形点缀色用于小面积提亮使用bright pops明快的跳色并伴随star and heart shapes星形与爱心图形。实操建议在主色板中抽取一两个高亮度色如奶油黄、浅珊瑚橙仅用于标题关键词、数字高亮或小图标面积控制在 10% 以内避免喧宾夺主。色板落地建议结合仓库机制若你的品牌或内容需要更精确的色彩控制可以通过 EXTEND.md 的custom_styles字段注入自定义风格片段。参考 preferences-schema.md 中给出的自定义风格示例写法custom_styles: - name: my-kawaii-brand description: Brand-aligned kawaii infographic prompt_fragment: Use pastel palette (#FFB6C1, #98D8C8, #E6E6FA, #FFF0F5); rounded shapes; big sparkly eyes; blushing cheeks; sparkles and hearts scattered.prompt_fragment会在 Step 5 被追加到提示词正文与内置的 kawaii 定义合并生效。视觉元素六大可爱符号系统原文档定义了六类标志性视觉元素它们在提示词中应当成组出现而非孤立使用元素说明提示词表达建议Big sparkly eyes角色的大而有神带高光闪光的眼睛large sparkling anime-style eyes with highlightsRounded, soft shapes圆润、柔软的外轮廓无锐角all shapes rounded and soft, no sharp edgesBlushing cheeks角色双颊的粉色腮红pink blush on cheeksSparkles and stars散落的星星与闪光粒子scattered sparkles and starsCute animal characters可爱的动物角色可作为信息载体cute chibi animals as mascotsChibi proportions二头身/三头身的 Q 版比例chibi proportions with oversized heads这六类元素在截图 kawaii.webp 中全部有据可查示例中的卡通女孩拥有水汪汪的大眼睛、双颊带粉色腮红、身体为 Q 版比例苹果、西兰花、水瓶均被拟人化为圆润带笑脸的可爱角色画面四周散布爱心与星星——一套完整的 kawaii 元素配方。实操要点kawaii 信息图的角色并非装饰而是信息承载者。例如每个模块可以用一个卡通角色「主持」角色表情与动作提示该模块的情绪基调让萌系造型服务于信息传达而非纯装饰。排版规范圆润字体与文字装饰kawaii 的排版延续「软萌友好」的总体基调字体形态rounded, bubbly fonts圆润、气泡感字体避免衬线体、细黑体等锐利或严肃的字体字母装饰在字母/文字上添加 cute decorations可爱装饰如小花、小点符号点缀文字中穿插 hearts and stars爱心与星星符号例如标题「Kawaii HEALTHY EATING TIPS!」搭配爱心气球这在截图中清晰可见整体气质soft, friendly appearance柔和、亲切的视觉气质文字不应产生任何「硬邦邦」的科技感。结合 base-prompt.md 的 Text Requirements 区段风格排版还需满足「标题醒目可读、关键概念视觉强调、标签清晰且尺寸得当」的通用要求——即可爱 ≠ 凌乱圆润字形仍需保证信息层级的可读性。适用场景什么时候该用 kawaii原文档给出的 Best For 是四类内容Cute tutorials萌系教程以可爱角色演示步骤的说明内容Childrens education儿童教育面向低龄受众的知识图萌感降低理解门槛Lifestyle content生活方式内容健康饮食、日常习惯、手账美学等轻松主题Character-driven explanations角色驱动的讲解以拟人化角色或吉祥物作为讲解主体的内容。截图示例 kawaii.webp 正是「健康饮食小贴士」这一生活方式主题的落地产物验证了风格与内容的匹配逻辑。与布局的搭配建议layout 与 style 正交可自由组合但内容结构仍影响最终效果。结合 analysis-framework.md 的内容类型分类以下组合与 kawaii 契合度较高内容类型推荐布局搭配理由多主题概览/科普bento-grid模块化卡片可独立承载卡通角色可爱元素各居一格默认推荐布局流程/教程linear-progression或comic-strip分步叙事天然适合角色带领式讲解分类集合periodic-table、tree-branching类别格子可用不同萌系图标区分关系/重叠venn-diagram、hub-spoke中心角色 四周元素角色驱动表达旅程/里程碑winding-roadmap故事感强配合软萌画风表现成长轨迹风格与布局的定义分别位于 references/layouts/ 与 references/styles/ 目录二者均会在 Step 5 合并进最终提示词。实操如何生成一张 kawaii 信息图方式一对话直接指定推荐向 Agent 提出需求时直接点名风格例如把这份「儿童健康饮食指南」做成信息图用 kawaii 风格。技能会在 Step 3 推荐组合时将kawaii列为候选风格并在 Step 4 通过确认环节与用户敲定 layout × style 组合、宽高比landscape 16:9 / portrait 9:16 / square 1:1、语言与图像后端。确认策略遵循 SKILL.md 的Confirmation Policy默认必须确认除非请求中带有--no-confirm、直接生成、跳过确认等显式豁免词。方式二EXTEND.md 预设为默认风格在 first-time-setup.md 引导的首次配置流程中将preferred_style设为kawaii或在已有 EXTEND.md 中直接写入version: 1 preferred_layout: bento-grid preferred_style: kawaii preferred_aspect: landscape language: zh preferred_image_backend: auto注意偏好仅影响 Step 3 的推荐排序与 Step 4 的默认值绝不跳过 Step 4 的人工确认见 SKILL.md 的 Confirmation Policy。方式三参考图锁定风格--refkawaii 属于强风格化品类若担心模型跑偏可提供参考图。按 SKILL.md 的 Reference Images 规则参考图有三种用法direct原图直传给后端、style提取线条/纹理/情绪追加进提示词、palette提取色值追加进提示词。例如仓库自带的 kawaii.webp 就是一个可直接复用的风格参考样例。提示词生成链路Step 5 组装原理最终提示词并非手写而是由 SKILL.md 的 Step 5 按固定顺序组装布局定义来自references/layouts/layout.md风格定义来自references/styles/kawaii.md基础模板base-prompt.mdStep 2 产出的结构化内容structured-content.md按 structured-content-template.md 生成确认后的语言与宽高比如{{ASPECT_RATIO}}解析为16:9。组装结果写入prompts/infographic.md后才会调用后端该文件同时是可复现记录——同一提示词可随时切换后端重新出图。后端调用kawaii 提示词如何交给图像模型当运行环境没有原生图像工具时技能会回退到codex-imagegen包装器调用契约见 codex-imagegen.md。优先路径是经由baoyu-image-gen技能统一调度${BUN_X} baoyu-image-gen-base/scripts/main.ts \ --provider codex-cli \ --image ABSOLUTE_output \ --promptfiles ABSOLUTE_prompts/infographic.md \ --ar 16:9其中--promptfiles传入的正是包含了 kawaii 风格指南的完整提示词文件。该包装器的 stdout 返回单行 JSON成功为{status:ok,path:...,bytes:N,...}失败为{status:error,...}error_kind覆盖timeout、spawn_failed、invalid_png等场景对可重试错误如timeout、output_missing技能会自动重试一次。--ar决定像素宽高比Codex 端会根据它推导实际尺寸因此横版16:9是信息图展示的稳妥选择。质量红线kawaii 风格的执行约束使用 kawaii 风格时需遵守技能的两条硬性红线见 SKILL.md禁止以 SVG / HTML / CSS 等代码渲染替代位图生成。kawaii 的萌系质感渐变腮红、星星光晕、柔软边缘依赖真实光栅渲染代码绘制的图形无法达标禁止事后用程序覆盖位图中的文字。若 kawaii 标题或标签出现错字、乱码应基于修正后的提示词重新生成新提示词文件 新输出路径而不是用 ImageMagick、Pillow 等在成品图上涂抹修复。此外analysis-framework.md 强调数据保真即便画面再可爱统计数字、引语与专有名词也必须逐字保留不能为「萌化」而改写事实。结语kawaii 风格是 baoyu-infographic 22 种风格中辨识度最高的亲和系选择其核心配方可浓缩为一句话马卡龙三主色 浅粉/奶油底与闪光覆盖 大眼睛/圆润/腮红/星爱/萌宠/童比例六元素 圆润字体与爱心符号排版。结合本技能「layout × style 正交组合 提示词文件化 后端可替换」的工程化设计你既可以在对话中一键触发也可以通过 EXTEND.md 固化为团队默认还能用--ref参考图与custom_styles自定义片段做品牌化扩展——让萌感成为可复现、可维护的信息图生产力。相关仓库路径速查风格定义原文styles/kawaii.md技能主文档风格画廊 / 工作流 / 确认策略SKILL.md提示词基础模板base-prompt.md图像后端调用契约codex-imagegen.md偏好配置模式preferences-schema.md首次配置流程first-time-setup.md内容分析框架analysis-framework.md结构化内容模板structured-content-template.md赞分享AI 技能AI 插件【免费下载链接】baoyu-skills项目地址https://gitcode.com/gh_mirrors/ba/baoyu-skills点击查看免费下载相关推荐用 baoyu-infographic 的 subway-map 风格打造地铁线路图式信息图配色、视觉元素与提示词实战指南用 baoyu infographic 的 subway map 风格打造地铁线路图式信息图配色、视觉元素与提示词实战指南 subway map地铁线路图AI 技能AI 插件baoyu-infographic 的 bold-graphic 风格高对比漫画风信息图设计与提示词实战baoyu infographic 的 bold graphic 风格高对比漫画风信息图设计与提示词实战 bold graphic 是 baoyu infogAI 技能AI 插件baoyu-infographic 的 hand-drawn-edu 风格实战马卡龙色系手绘教育信息图的设计规范与提示词工程baoyu infographic 的 hand drawn edu 风格实战马卡龙色系手绘教育信息图的设计规范与提示词工程 本文聚焦 baoyu infogAI 技能AI 插件创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考