
概要 📖 – 色相・彩度・明度を調整
HSV Adjust TOPは、入力画像の中で指定した色相範囲のピクセルだけを選択し、その色相・彩度・明度を調整して新しい色味で出力する TOPです。Start Color (基準色) と Hue Range (色相範囲) で「どの色を変えるか」を決め、Hue Offset / Saturation Multiplier / Value Multiplier で「どう変えるか」を指定します。Falloff 系パラメータを併用すると範囲外との境界が滑らかにブレンドされ、自然な色変換が可能になります。
主な用途 🎯
- 特定色相だけを別色に置き換える色相シフト (青空をオレンジ空に等)
- 映像全体の彩度・明度を一括で調整 (ビビッド化 / デサチュレート / モノクロ風)
- Hue Offset の時間アニメーションによる動的色相回転 (サイケデリック演出)
- ブランドカラー・演出カラーへの色補正 (素材の色味を演出意図に揃える)
- クロマキー前段の色相整形 (背景色を分離しやすい色相にシフトして分離精度を向上)
データフロー 🔄
入力: 任意の TOP (画像)
↓
Start Color と Hue Range / Saturation Range / Value Range で対象画素を絞り込み
↓
Hue Falloff / Saturation Falloff / Value Falloff で範囲外との境界を滑らかにブレンド
↓
Hue Offset / Saturation Multiplier / Value Multiplier で色変換を適用
↓
出力: 色相・彩度・明度を調整した同解像度テクスチャ
初心者の方は、以下日本語書籍も手元にあると安心です。

実際の案件事例まで踏み込んで紹介されていて、効率よくスキルアップするなら必携の二冊です!
パラメータ解説 ⚙️
HSV Tweak Page 📋
基準色 .startcolor 🎯
色相調整の基準となる色 (基準色) を指定
Start Color .startcolor 🎨Start Color (基準色) — HSV 調整処理の中心となる色を指定します。この色を基準に Hue Range で指定した範囲内の色相だけが調整対象となります。公式 docs の例では cyan (色相値 180) を基準色に設定したケースが示されています。
色相調整 .hue 🌈
色相の選択範囲・境界ぼかし・回転量
Hue Range .huerange 📏Hue Range (色相範囲) — Start Color から調整対象とする色相の幅。値 1 では基準色とまったく同じ色相のピクセルのみが対象、値 360 では全色相が対象になります。公式の例として「Start Color = 180 (cyan)、Hue Range = 20」の場合は色相 170〜190 の範囲が調整対象になります。
Hue Falloff .huefalloff 〰️Hue Falloff (色相境界のぼかし) — Hue Range の外側との境界をどれだけ滑らかにブレンドするかを制御します。値を大きくするほど、調整対象の色相から非対象色相へのフェードが緩やかになり、境界線の段差が目立たなくなります。
Hue Offset .hueoffset ↪️Hue Offset (色相回転量) — 上記で選択した色相に対して加算する色相のオフセット値 (0〜360)。公式 docs の例: 入力ピクセル色相 180 (cyan) に Hue Offset = 100 を加えると色相 280 (violet) に変換されます。absTime.seconds * 60 等の式を入れると時間とともに色相が回転するアニメーションが作れます。
彩度調整 .saturation 🎨
彩度の選択範囲・境界ぼかし・倍率
Saturation Range .saturationrange 📐Saturation Range (彩度範囲) — Start Color の彩度を基準に調整対象とする彩度の範囲 (0〜1)。値を小さくすると基準色と近い彩度のピクセルだけが対象になり、値を大きくするとより広い彩度範囲が対象になります。
Saturation Falloff .saturationfalloff 〰️Saturation Falloff (彩度境界のぼかし) — Saturation Range の外側への境界の柔らかさを制御します。値を上げると彩度範囲外との切れ目がなめらかにブレンドされます。
Saturation Multiplier .saturationmult ✖️Saturation Multiplier (彩度倍率) — 上記で選択した彩度値に乗算される倍率。0 にすると選択範囲の彩度がゼロ (グレースケール化)、1 で現在の彩度を維持、2 で彩度が 2 倍になります。デサチュレート (彩度を下げる) やビビッド化 (彩度を上げる) はこのパラメータで制御します。
明度調整 .value 💡
明度の選択範囲・境界ぼかし・倍率
Value Range .valuerange 📏Value Range (明度範囲) — Start Color の明度を基準に調整対象とする明度の範囲 (0〜1)。例えば暗い部分だけを対象にしたい場合は基準色を暗い値に、Value Range を狭めに設定します。
Value Falloff .valuefalloff 〰️Value Falloff (明度境界のぼかし) — Value Range の外側との境界をどれだけ滑らかにブレンドするかを制御します。
Value Multiplier .valuemult 🔆Value Multiplier (明度倍率) — 上記で選択した明度値に乗算される倍率。1 未満で暗くし、1 より大きい値で明るくします。ハイライトだけを暗く落とす、シャドウだけ持ち上げるといったゾーン別の明度補正に利用します。
Common Page 🔧
Output Resolution .outputresolution 🖼️
出力解像度の決定方式
| 項目 | 内部名 | 説明 |
|---|---|---|
| Use Input | .useinput |
入力 TOP の解像度をそのまま継承 |
| Eighth | .eighth |
入力解像度の 1/8 |
| Quarter | .quarter |
入力解像度の 1/4 |
| Half | .half |
入力解像度の 1/2 |
| 2X | .2x |
入力解像度の 2 倍 |
| 4X | .4x |
入力解像度の 4 倍 |
| 8X | .8x |
入力解像度の 8 倍 |
| Fit Resolution | .fit |
指定解像度に縦横比を保持して収める |
| Limit Resolution | .limit |
指定解像度を上限としてクランプ |
| Custom Resolution | .custom |
Resolution パラメータで任意指定 |
Resolution .resolution 📐
カスタム解像度の幅・高さ指定 (Output Resolution = Custom 等の時のみ有効):
- Resolution W: 出力幅 (ピクセル単位)。
Output ResolutionがCustom Resolution/Fit Resolution/Limit Resolutionの時に有効 - Resolution H: 出力高 (ピクセル単位)。同上
Resolution Menu .resmenu 📋
よく使う解像度プリセットのドロップダウン:
- Resolution Menu: NTSC / PAL / HDTV 720 / HDTV 1080 / 4K UHD 等のプリセットから選択すると
Resolution W/Resolution Hが自動セットされる
Use Global Res Multiplier .resmult 🔢
プロジェクト全体の解像度倍率の適用:
- Use Global Res Multiplier: Project Settings の Global Resolution Multiplier をこの TOP に適用するかどうか。プロトタイプを低解像度で動かしつつ最終出力で一括フル解像度化する運用に便利
Output Aspect .outputaspect 📏
出力アスペクト比の決定方式
| 項目 | 内部名 | 説明 |
|---|---|---|
| Use Input | .useinput |
入力 TOP のアスペクトを継承 (伝播事故の元、非推奨) |
| Resolution | .resolution |
解像度から自動導出 (推奨デフォルト) |
| Custom Aspect | .custom |
Aspect1 / Aspect2 で手動指定 |
Aspect .aspect 📐
カスタムアスペクト比の指定 (Output Aspect = Custom Aspect の時のみ有効):
- Aspect1: 横方向アスペクト値 (
Output Aspect= Custom Aspect の時のみ有効) - Aspect2: 縦方向アスペクト値 (同上)
Input Smoothness .inputfiltertype 🎚️
入力テクスチャのサンプリング方式
| 項目 | 内部名 | 説明 |
|---|---|---|
| Nearest Pixel | .nearest |
最近傍ピクセルサンプリング (ピクセルアート向け、ジャギーが残る) |
| Interpolate Pixels | .linear |
バイリニア補間 (滑らか、デフォルト) |
| Mipmap Pixels | .mipmap |
ミップマップ補間 (縮小時のモアレ抑制、わずかにコスト高) |
Fill Viewer .fillmode 🖥️
ビューア内でのテクスチャの収め方
| 項目 | 内部名 | 説明 |
|---|---|---|
| Use Input | .useinput |
入力 TOP の Fill Viewer 設定を継承 |
| Fill | .fill |
ビューアいっぱいに引き伸ばす (アスペクト無視) |
| Fit Horizontal | .width |
横幅に合わせて収める (上下に余白) |
| Fit Vertical | .height |
縦幅に合わせて収める (左右に余白) |
| Fit Best | .best |
アスペクト保持で内側に収まる最大サイズ |
| Fit Outside | .outside |
アスペクト保持で外側まで覆う最小サイズ (はみ出しあり) |
| Native Resolution | .nativeres |
テクスチャのネイティブ解像度のまま等倍表示 |
Viewer Smoothness .filtertype 🎛️
ビューア表示時のサンプリング方式
| 項目 | 内部名 | 説明 |
|---|---|---|
| Nearest Pixel | .nearest |
最近傍ピクセルサンプリング (ピクセル単位での確認向け) |
| Interpolate Pixels | .linear |
バイリニア補間 (滑らか、デフォルト) |
| Mipmap Pixels | .mipmap |
ミップマップ補間 (縮小ビュー時のモアレ抑制) |
Passes .npasses 🔁
オペレータの反復実行回数:
- Passes: TOP の処理を何パス繰り返すかの整数値。前回パスの結果が次回パスの入力になる。HSV Adjust TOP の場合、同じ色相シフトを多重適用するため色相回転が累積する
Channel Mask .chanmask 🎨
処理対象のチャンネルマスク (R/G/B/A 個別トグル):
- Channel Mask:
R/G/B/A各チャンネルのオン/オフトグル。オフのチャンネルは TOP の処理を受けず入力値がそのまま通過
Pixel Format .format 🎨
出力テクスチャのピクセルフォーマット (ビット深度・チャンネル構成)
| 項目 | 内部名 | 説明 |
|---|---|---|
| Use Input | .useinput |
入力 TOP のフォーマットを継承 |
| 8-bit fixed (RGBA) | .rgba8fixed |
標準 8 ビット固定小数 RGBA (デフォルト、軽量) |
| sRGB 8-bit fixed (RGBA) | .srgba8fixed |
sRGB ガンマ補正済 8 ビット RGBA |
| 16-bit float (RGBA) | .rgba16float |
16 ビット浮動小数 RGBA (HDR・中間処理向け) |
| 32-bit float (RGBA) | .rgba32float |
32 ビット浮動小数 RGBA (最高精度、メモリ大) |
| 10-bit RGB with 2-bit Alpha | .rgb10a2fixed |
10-10-10-2 ビット固定小数 (バンディング抑制) |
| 16-bit fixed (RGBA) | .rgba16fixed |
16 ビット固定小数 RGBA |
| 11-bit float (RGB) | .rgb11float |
11-11-10 ビット浮動小数 RGB (アルファなし、HDR 軽量) |
| 16-bit float (RGB) | .rgb16float |
16 ビット浮動小数 RGB (アルファなし) |
| 32-bit float (RGB) | .rgb32float |
32 ビット浮動小数 RGB (アルファなし) |
| 8-bit fixed (Mono) | .mono8fixed |
8 ビット固定小数モノクロ |
| 16-bit fixed (Mono) | .mono16fixed |
16 ビット固定小数モノクロ |
| 16-bit float (Mono) | .mono16float |
16 ビット浮動小数モノクロ |
| 32-bit float (Mono) | .mono32float |
32 ビット浮動小数モノクロ |
| 8-bit fixed (RG) | .rg8fixed |
8 ビット固定小数 R+G 2 チャンネル |
| 16-bit fixed (RG) | .rg16fixed |
16 ビット固定小数 R+G |
| 16-bit float (RG) | .rg16float |
16 ビット浮動小数 R+G |
| 32-bit float (RG) | .rg32float |
32 ビット浮動小数 R+G |
| 8-bit fixed (A) | .a8fixed |
8 ビット固定小数アルファ単体 |
| 16-bit fixed (A) | .a16fixed |
16 ビット固定小数アルファ単体 |
| 16-bit float (A) | .a16float |
16 ビット浮動小数アルファ単体 |
| 32-bit float (A) | .a32float |
32 ビット浮動小数アルファ単体 |
| 8-bit fixed (Mono+Alpha) | .monoalpha8fixed |
8 ビット固定小数モノクロ+アルファ |
| 16-bit fixed (Mono+Alpha) | .monoalpha16fixed |
16 ビット固定小数モノクロ+アルファ |
| 16-bit float (Mono+Alpha) | .monoalpha16float |
16 ビット浮動小数モノクロ+アルファ |
| 32-bit float (Mono+Alpha) | .monoalpha32float |
32 ビット浮動小数モノクロ+アルファ |
実践アイデア 💡
Example 1: 特定の色だけを別色相にシフト 🌅
Movie File In TOP → HSV Adjust TOP (Start Color=青, Hue Offset=180) → Out TOP
風景動画の空の色 (青系) だけをオレンジ系に置き換えるワークフロー。Start Color で対象の基準色を指定し、Hue Range で対象色相の幅を絞ったうえで、Hue Offset で色相を 180 度回して反対色相にシフトする。Hue Falloff を併用すれば空と地面・建物の境界が滑らかにブレンドされ自然な変換になる。
- Movie File In TOP で風景動画を読み込み、HSV Adjust TOP の入力に接続
Start Colorを空の色 (青系) に設定 (色相 = 約 210)Hue Rangeを 30〜60 程度に設定し、空に近い色相だけを対象化Hue Offsetを 180 に設定して青系 → オレンジ系に色相回転Hue Falloffを上げて空と他の色の境界を滑らかにブレンド
Example 2: 彩度を下げて映画調に統一 🎞️
入力 TOP → HSV Adjust TOP (Hue Range=360, Saturation Multiplier=0.3) → 出力 TOP
映像全体の彩度を一括で下げて、落ち着いた色調・映画調のトーンに統一する基本ワークフロー。Hue Range を最大の 360 に設定して全色相を対象化し、Saturation Multiplier を 1 未満に下げることで、色相は保ったまま彩度だけを抑える表現が作れる。完全モノクロが目的なら Monochrome TOP の方が軽量。
- 入力 TOP (Movie File In TOP や Render TOP 等) を HSV Adjust TOP に接続
Hue Rangeを 360 に設定し全色相を調整対象化Saturation Multiplierを 0.3〜0.5 に下げて彩度を抑える- より強くデサチュレートしたい場合は
Saturation Multiplier= 0 (完全グレースケール)
Example 3: 時間に応じた動的色相回転 🌈
Constant TOP → HSV Adjust TOP (Hue Offset = absTime.seconds * 60) → Out TOP
Hue Offset パラメータに時間ベースの式を入力して画面全体の色相を時間とともに回転させ、サイケデリックなアニメーション効果を作る応用例。Hue Range を 360 にすれば全色相が回転し、特定色相だけ回したい場合は Start Color と Hue Range で対象を絞る。
- Constant TOP もしくは任意の入力 TOP を HSV Adjust TOP に接続
Hue Rangeを 360 に設定し全色相を回転対象化Hue OffsetパラメータにabsTime.seconds * 60等の式を入力 (1 秒で 60 度回転)- 回転速度は係数 (60 の部分) で調整、逆回転は負の値
関連オペレータ 🔗
類似機能OP 🔍
- Level TOP — 明度・コントラスト・ガンマ等の輝度ベース色補正 (HSV ではなく RGB 直接調整)
- Lookup TOP — ルックアップテーブル (LUT) による任意色変換 (HSV より自由度高、テーブル定義の手間あり)
- Monochrome TOP — RGB → グレースケール変換専用 (HSV Adjust の Saturation=0 より高速・軽量)
- Channel Mix TOP — RGB チャンネル間の線形混合 (色相回転を行列演算で表現)
組み合わせ推奨OP 🔄
- RGB to HSV TOP — RGB → HSV 色空間変換 (HSV Adjust の内部処理を明示化したい場合の前段)
- HSV to RGB TOP — HSV → RGB 色空間逆変換 (手動 HSV 操作後に表示用 RGB に戻す)
- Tone Map TOP — HDR → SDR のトーンマッピング (HSV Adjust の前後どちらでも組み合わせ可)
- Chroma Key TOP — HSV Adjust で背景色相を整えてから Chroma Key で分離すると精度向上
- Composite TOP — 色補正後の複数レイヤ合成
前処理・後処理TOP 🎯
Info CHOP情報 📊
HSV Adjust TOPは Info CHOP による詳細情報取得に対応しています。出力テクスチャの resolution_w / resolution_h / aspectx / aspecty / depth / num_components / gpu_mem_used 等の標準 TOP メタチャンネルを取得します。
TOP固有情報 🖼️
resx: TOP の出力解像度 X (ピクセル単位)resy: TOP の出力解像度 Y (ピクセル単位)aspectx: アスペクト比 Xaspecty: アスペクト比 Ydepth: 3D テクスチャ / テクスチャ配列の深度 (2D テクスチャでは 1)gpu_memory_used: TOP が消費している GPU メモリ量 (MB 単位)
汎用オペレータ情報 🔄
total_cooks: プロセス開始からのクック回数cook_time: 最後のクック時間 (ミリ秒)cook_frame: 最後にクックされたフレーム番号warnings: 警告数errors: エラー数
トラブルシューティング ⚠️
よくある問題と解決策 🔧
❌ Problem: 期待した色相だけが変わらない / 関係ない色まで変わる
✅ Solution:
Start Colorがターゲット色とずれていないか色相値を確認 (HSV 色相値は 0〜360)Hue Rangeを狭めて対象色相を絞り込み、広い場合はHue Falloffも併用して境界を滑らかにSaturation Range/Value Rangeも併用して、彩度・明度の条件で対象を限定する
❌ Problem: 色変換後の境界に色のにじみ・段差が出る
✅ Solution:
Hue Falloff/Saturation Falloff/Value Falloffを上げて境界をブレンドPixel Formatを16-bit float (RGBA)以上に上げてバンディング・量子化誤差を低減- 上流で Blur TOP を軽く適用してエッジ周辺の高周波ノイズを抑える
❌ Problem: GPU 負荷が高くフレームレートが落ちる
✅ Solution:
Output ResolutionをHalf/Quarterに下げて処理画素数を削減Pixel Formatを8-bit fixed (RGBA)に固定してメモリ帯域を抑える- Crop TOP 等で HSV 調整が必要な領域だけを切り出してから処理
❌ Problem: Hue Offset アニメーションでフレームごとにちらつく
✅ Solution:
Hue Offsetの式が連続値 (absTime.seconds * 60等) になっているか確認 (フレーム単位の離散ジャンプを避ける)Hue Falloffを上げて色相境界の急変を緩和- 前段に Tone Map TOP を入れてダイナミックレンジを安定させる
参考資料 📚
その他 🔗
- TouchDesigner Wiki — Category:TOPs
- TouchDesigner Wiki — Pixel Formats 解説
- TouchDesigner Wiki ホーム
- TouchDesigner 公式 Forum
- Facebook — TouchDesigner Help Group

