TiXL ColorGrade 算子深度指南基于 Gain / Gamma / Lift 的实时图像色彩分级与暗角控制【免费下载链接】t3TiXL is an open source software to create realtime motion graphics.项目地址: https://gitcode.com/GitHub_Trending/t3/t3本指南以 ColorGrade.md 为核心骨架结合其 HLSL 着色器实现、C# 算子定义与符号默认配置展开。ColorGrade 是 TiXL实时动态图形创作工具Lib.image.color算子库中的标准图像调色节点用于对输入纹理执行高光Gain、中间调Gamma、阴影Lift三段式色彩分级并附带饱和度与暗角Vignette控制。读完本文你将掌握每个输入参数的精确含义与默认值、底层像素着色器的分级数学原理以及借助预设混合、色块拖拽与波形监视器进行高效调色的实战方法。ColorGrade 在 TiXL 中的定位ColorGrade 属于算子库Lib.image.color该目录下的算子都聚焦于图像色彩处理。根据 Lib.image.color 算子索引同目录还包含AdjustColors综合色彩属性调整、ColorGradeDepth基于深度缓冲的高级分级、ChannelMixer、Tint、ToneMapping等节点。ColorGrade 的定位是“快速、直观”的标准分级工具它只做三件事——饱和度、三段式明度分级、暗角输入输出均为一张 2D 纹理可任意串接在渲染链中。从算子实现看ColorGrade.cs 声明了一个输出槽SlotTexture2D Output与 11 个输入槽所有逻辑实际由 ColorGrade.hlsl 像素着色器完成。算子符号配置 ColorGrade.t3 表明该符号内部由_ImageFxShaderSetupStatic指向Lib:shaders/img/ColorGrade.hlsl驱动输入参数经由多个Vector4Components/Vector2Components分解子节点接线到着色器常量缓冲区因此你在节点 UI 上看到的参数最终都会汇入 HLSL 的ParamConstants。输入参数总览文档给出的完整参数表如下本文补充了每个参数的默认值取自 ColorGrade.t3 的DefaultValue与底层作用说明名称相关性与类型说明默认值Texture2dTexture2D 必需待分级的输入纹理nullPreSaturateSingle前置饱和度0 为灰度、1 为原饱和1.0GainVector4高光增益RGB 为颜色、A 为强度(0.5, 0.5, 0.5, 0.506)GammaVector4中间调伽马RGB 为颜色、A 为强度(0.5, 0.5, 0.5, 0.506)LiftVector4阴影抬升RGB 为颜色、A 为强度(0.5, 0.5, 0.5, 0.25)VignetteColorVector4暗角颜色RGB 为颜色、A 为强度(0.5, 0.5, 0.5, 0.0)VignetteRadiusSingle暗角半径负值可反转效果1.0VignetteFeatherSingle暗角羽化过渡柔和度1.0VignetteCenterVector2暗角中心偏移(0, 0)GenerateMipmapsBoolean执行前是否为输入纹理生成 mipmapfalseClampResultBoolean是否将结果钳制到有效范围false输出只有一个槽Output类型T3.Core.DataTypes.Texture2D即分级后的 2D 纹理可直接连接到后续算子或最终渲染目标。中性值约定为什么默认色是 0.5注意上表中 Gain / Gamma / Lift / VignetteColor 的默认 RGB 均为0.5而不是0。这与着色器中的中性处理逻辑一致gainScaled Gain.rgb * 2 * Gain.a (0.5 - Gain.a)当Gain.rgb 0.5时该式恒等于0.5代入后续公式恰好不产生任何偏移——因此RGB 0.5 是“无色”中性点。同理颜色向 0.5 方向偏移会向该色相倾斜向 0.5 方向偏移则补其互补色。Alpha 通道控制效果强度alpha 0.5时2*a 1颜色完全生效alpha 0时则完全抵消颜色分量只保留0.5中性基底。默认 Gain/Gamma 的A 0.506表示默认即以满强度执行中性分级而 Lift 的A 0.25意味着默认阴影抬升强度减半避免默认状态下画面出现明显偏色。输出与连接ColorGrade 只有一个输出OutputT3.Core.DataTypes.Texture2D这是典型的单进单出图像算子设计方便与 ColorGradeDepth、AdjustColors 等节点以串联或并联方式组合。由于输出仍是普通纹理你可以在其后再接任意纹理处理算子继续加工。底层实现像素着色器逐步解析整个分级管线在 ColorGrade.hlsl 的psMain中完成共分四步输入钳制 → 饱和度 → 暗角 → Lift/Gamma/Gain 分级。1. 输入钳制与饱和度c.rgb clamp(c.rgb, 0.000001, 1000); // Saturation float gray (c.r * 0.22 c.g * 0.707 c.b * 0.071); c.rgb lerp(float3(gray, gray, gray), c.rgb, PreSaturate);首先将 RGB 钳制在极小值到 1000 之间避免后续幂运算遇到 0 或极端 HDR 值产生 NaN。饱和度采用经典的 Rec.709 亮度加权0.22 / 0.707 / 0.071 的近似系数计算灰度然后按PreSaturate在灰度与原色之间线性插值PreSaturate 0得到灰度图 1保持原饱和度。由于该饱和度作用于分级之前文档称之为“前置饱和度”Pre-Saturate。2. 暗角Vignette计算float flipEdge VignetteRadius 0 ? -1 : 1; float v length((uv - 0.5 - VignetteCenter * float2(1, -1))); v / VignetteRadius * flipEdge / 2; v - 0.5; v smoothstep(0, 1, (v - 0.5) / (VignetteBias * flipEdge * 2) 0.5);暗角以归一化 UV 坐标计算以屏幕中心(0.5, 0.5)为基准减去VignetteCenter偏移后取到中心的距离再除以半径得到归一化距离。smoothstep将距离映射为平滑的 0–1 羽化值其过渡宽度由VignetteBias即 UI 中的VignetteFeather参数控制。值得注意的细节是VignetteRadius 0时flipEdge -1这会翻转暗角方向——负半径可用于实现反向效果中心变暗、边缘变亮为暗角提供了超出常规的创意空间。VignetteCenter允许把暗角中心偏移到画面任意位置Y 分量在着色器中被乘以(1, -1)翻转即 UI 中向上的偏移对应 UV 中向上。最终v值用于调制暗角颜色对增益的附加偏移gainScaled (VignetteColor.rgb - 0.5) * v * (VignetteColor.a * 2 1);即暗角本质上是在高光增益上叠加一个随距离变化的颜色偏移VignetteColor.rgb 0.5时无暗角越偏离 0.5 暗角越明显VignetteColor.a放大暗角强度。3. Lift / Gamma / Gain 分级核心公式float3 liftScaled Lift.rgb * 2 * Lift.a (0.5 - Lift.a); float3 gammaScaled Gamma.rgb * 2 * Gamma.a (0.5 - Gamma.a); float3 gainScaled Gain.rgb * 2 * Gain.a (0.5 - Gain.a); gainScaled (VignetteColor.rgb - 0.5) * v * (VignetteColor.a * 2 1); c.rgb pow((c.rgb (liftScaled.rgb * 2 - 1) * (1 - c.rgb)) // Lift * gainScaled * 2, // Gain 1 / (gammaScaled * 2)); // Gamma这是经典影调曲线模型的实时实现Lift阴影c.rgb (liftScaled * 2 - 1) * (1 - c.rgb)在原始颜色与“抬升量”之间按亮度反比插值——暗部受 Lift 影响最大亮部几乎不受影响Gain高光上一步结果乘以gainScaled * 2对全图做乘法增益亮部受影响最显著Gamma中间调整体做pow(x, 1/(gammaScaled*2))伽马幂运算主要重塑中间调对比度而不改变纯黑纯白。三个分段通过乘除/幂运算天然联动任何参数在0.5中性值时公式都退化为恒等操作因此默认配置下画面不发生任何变化——这正是“灰值即中性”设计文档原话Gray values are neutral的体现。运算完成后再次钳制 RGB 并约束 Alpha 到[0,1]输出。补充文档中“Alpha can be used to amplify the effect”Alpha 可用于放大效果即指上述2 * a的强度系数对于 VignetteColor 则是VignetteColor.a * 2 1的放大因子。4. GenerateMipmaps 与 ClampResult 的作用这两个布尔参数不直接出现在ParamConstants中而是由 ColorGrade.t3 符号内部的BoolToFloat子节点与一个默认值为0.15的Value节点转换后连入_ImageFxShaderSetupStatic的对应输入。从接线结构可以推断GenerateMipmaps控制着色器执行前是否为输入纹理生成 mipmap采样缩小时需要而ClampResult控制执行后是否对结果做钳制处理对应 HLSL 末尾的clamp语句开关。默认均为false即在需要保留 HDR 数据或避免额外 GPU 开销时可保持关闭。实战技巧预设混合与快速调色原文档给出了三条高价值的交互技巧适用于 TiXL 节点 UIALT 键悬停混合预设在参数预设presets上按住ALT键悬停即可预览并混合预设效果而非直接覆盖当前值——这使你可以把多个预设的效果按需要渐进融合是快速探索调色方向的高效方式。垂直拖拽色块微调亮度与 Alpha直接按住鼠标左键/右键上下拖拽参数的颜色色块color swatch即可快速调整该参数的亮度RGB与透明度Alpha。左、右鼠标键分别控制不同通道是脱离数字输入框的直觉化调色手段。接入 WaveForm2 监视波形在 ColorGrade 输出后串联WaveForm2算子以波形waveform形式可视化图像明度分布直观核对高光、中间调、阴影是否过曝或欠曝从而精准设定 Gain / Gamma / Lift 的幅度。相关算子对比与选型建议文档明确给出了三条选型线索ColorGradeDepth功能更完整的“深度版”分级算子。它在 ColorGrade 的同一套 Gain / Gamma / Lift / Vignette 参数基础上额外接入DepthBuffer、Gradient、GradientDepthRange与CamNearFarClip可依据深度缓冲生成随距离变化的渐变着色近处物体与远处物体颜色不同适合需要大气透视或空间分层的 3D 场景。其着色器实现见 ColorGradeWithDepth.hlsl用DepthToSceneZ将深度缓冲换算为场景 Z归一化后采样渐变纹理并把渐变颜色叠加进gainScaled。文档还建议与SetFog算子组合使用仓库中附有现成的 ColorGradeDepthExample 示例供参考。AdjustColors面向“快速出片”的综合性调色算子提供 Colorize、Saturation、Hue、Contrast、Exposure、Brightness、OrangeTeal橙青色调等更贴近传统调色流程的参数并自带轻微暗角。如果你的需求是快速套用电影感风格而非精细三段式分级可优先考虑它。ChannelMixer / Tint / ToneMapping等同目录算子则覆盖通道混合、双色调染色、HDR 色调映射等不同细分场景可按需查阅 算子索引。选型建议需要精细控制高光/中间调/阴影且无需深度信息时选ColorGrade需要空间深度着色或与 3D 场景联动时选ColorGradeDepth需要快速整体风格化橙青、色调、对比度时选AdjustColors。三者均可串联使用例如先用 AdjustColors 定整体风格再用 ColorGrade 精细调整影调。小结ColorGrade 是 TiXL 中最常用、也最能体现“灰值中性 Alpha 放大”设计哲学的调色算子之一。它的全部秘密都浓缩在 ColorGrade.hlsl 的十几行像素着色器中前置饱和度、UV 距离暗角、以及由 Lift / Gamma / Gain 构成的影调三段式幂运算。理解这套公式你就能精确预测每个参数对画面的影响再配合 ALT 预设混合与色块拖拽即可在实时动态图形工作流中完成从基础校正到风格化调色的全流程。【免费下载链接】t3TiXL is an open source software to create realtime motion graphics.项目地址: https://gitcode.com/GitHub_Trending/t3/t3创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考