Using Color Lookup Tables (CLUTs)

What is this all about?

Color Lookup Tables – CLUTs (also “Color LUTs“) are a method of storing and reusing complex linear color transformations*.
CLUTs have the advantages of being supported by many video and image processing software packages, and also the ability to be calculated in real-time on the GPU, costing very little computing resources.
* More simple, daily use terms can be: “color styles”, or “color corrections”

CLUTs are used in the movie production industry to perform color conversions of images acquired from different sources for monitoring and editing purposes, and also for testing, applying and sharing different creative color styles across different departments, and stages of the production.
Examples of common CLUT file formats are *.3DL and *.CUBE

Why is this called a “3D” or “Cube” Lookup Table?

The reason CLUTs are referred to as “3D” color lookup tables or “Cube LUT” is that they store the effect of color operations as linear transformations of a 3D cubic space.
To understand this we have to imagine RGB color encoding as a 3D space with the R, G and B values of each color being coordinates in this cubic color space.
This means that the color correction operations we perform to create a color style, like adding contrast, saturation, warming the hues etc. are all defined as a function that for every color coordinate in the RGB color cube space defines the new coordinate where the corrected or stylized color is found.
The term Lookup table means that the new color values don’t have to be calculated every time because they have been pre-calculated and stored in a table of values.
3D CLUTs are often processed and stored as 3D Cubic textures like this example generated with Blackmagic Fusion of a 32 x 32 x 32 value CLUT.
Imagine the little 32 x 32 square patches all stacked one upon the other, that would create a 32 x 32 x 32 RGB color cube, with which color transformations can be stored by simply applying them on this texture:Cube0000

Working with CLUTs:

In this post we’ll go trough the process of creating and using a CLUT in some popular creative software packages.
* Note that there are many other software packages that support creation and usage of CLUTs, the process should be similar.

Steps shown in the following software:
Adobe Photoshop 2020
Adobe After Effects 2020
Adobe Premiere 2020
Blackmagic Design Fusion 9

In this example our source image with which the CLUT will be designed is an interior scene modeled with Blender 2.82 and rendered with Cycles Render Engine with “Filmic” tone-mapping applied, saved as a PNG file.
* I usually save Linear unclamped 32bit float EXR files as the raw output from render engines, because this is the format that provides the most freedom to manipulate and process rendered images and animation, but from my experience CLUTS don’t work well on linear unclamped color, for that reason I usually apply them at a later stage of the image development (usually after applying tone-mapping to the image).
This is why I saved the file directly as a tone-mapped PNG for this example.

A.Test_Image

Creating a CLUT in Adobe Photoshop:

For this example, a greenish-contrasty-desaturated color style is created in Photoshop by applying color adjustment layers to the image.
In this case Color Balance, Vibrance, and Curves.
* You can use different numbers and combinations of color adjustments

B.Photoshop_Grade

The new Color Style is now exported to CLUT files:

C.Photoshop_Export_CLUTS

In the Export Color Lookup Tables dialog allows naming the CLUT, adding a description, setting a quality for the color transform it will define, and selecting the wanted CLUT file formats that will be written.
After clicking OK the CLUT files will be saved in a chosen location.C1.Photoshop_Export_CLUTS

Note:
Saving the CLUT in the Presets\3DLUTs folder (found in the Adobe Photoshop installation folder) will allow reusing the CLUT as a preset look available by drop-down selection without having to locate the file each time.

Applying a CLUT in Adobe Photoshop:

With the image later selected, add a Color Lookup adjustment layer:

D.Photoshop_Lut_Adjustment

In the Color Lookup adjustment properties, open the 3DLUT File drop-down, choose Load 3D LUT, and locate the CLUT file you saved:E.Photoshop_Lut_Load

The original image now has the same color style we created earlier, but this time it’s applied by only a single Color Lookup adjustment layer:

F.Photoshop_Lut_Correction

An example of the same CLUT applied to a different image:

F1.Photoshop_Lut_Correction_B

Applying a CLUT in Adobe After Effects:

Add a Util > Apply Color LUT effect to a layer,
In the Effect Controls window, click Choose LUT and locate the wanted CLUT file:

G.AE_Apply_CLUT

Applying a CLUT in Adobe Premiere:

  1. Select the image/video clip in the timeline.
  2. Switch to the Color UI tab to get access to the Lumetri Color controls on the right.
  3. In the Creative section of the Lumetri Color controls, open the Look dropdown, choose Browse and locate the wanted CLUT file.

I.Premiere_Apply_CLUT

I.Premiere_Apply_CLUT_B

Applying a CLUT in Blackmagic Design Fusion:

Add a LUT >File LUT node to the image source.
In the File LUT properties, click the browse button and locate the wanted CLUT file:

H.Fusion_Apply_CLUT

Creating a CLUT in Blackmagic Design Fusion:

* See the numbered nodes in the flow graph below

  1. Source image/video on which the CLUT is designed.
  2. A LUT Cube Creator node, generating default neutral 3D CLUT data in the form of a Color Cube map.
  3. The nodes creating the actual color style (in this case a Color Corrector and Color Curve nodes) are operating on the LUT Cube Creator node’s output.
  4. A LUT Cube Apply node is applying the stylized CLUT data to the image/video for previewing purpose (displayed on the right viewer)
  5. A LUT Cube Analyzer node generates CLUT data from the styled LUT Cube Creator data, and allows saving it to disk as a CLUT file.
    * Choose a location and click Write File to save the CLUT file.

K.Fusion_Create_LUT

UE4 – Using a Post Process material to create a simple fog effect

Software:
Unreal Engine 4.24

An example of a simple fog effect created using a Post Process material:

 

The fog material Blueprint:
The method for creating the fog effect is to take distance of the objects from the camera, map it to a value range suitable for color blending 0 – 1, and use that for blending the object’s color with the fog color, so the further away the object, the more it will be colored by the fog.
Start by creating a new material, and follow the details below to create the Blueprint:

Fog_PP_material

  1. The Material Domain is set to Post Process.
    And has its Blendable Location parameter set to Before Tonemapping so it will be applied on the raw render.
    Annotation 2020-05-04 011312
  2. A SceneTexture node with its Scene Texture Id parameter set to PostProcessInput0 serves as the input of the view’s original rendered pixel colors:
    Annotation 2020-05-04 011050
  3. A Lerp (LinearInterpolate) node calculates the blending of the view’s original pixel colors with the Fog color to create the fog effect.
  4. A SceneTexture node with its Scene Texture Id parameter set to SceneDepth serves as the input of depth of each pixel (distance from camera):
    Annotation 2020-05-04 012256
  5. A ComponentMask node set to the R channel allows using the depth data as a single float value instead of a Vector4:
    Annotation 2020-05-04 012603
  6. A Clamp node is used to clamp (limit) the depth value to the Fog’s maximum depth value (see below)
  7. A RemapValueRange maps the distance value to a fog density value that will be used as the Lerp (3) alpha parameter.
    Simply put, the further the object, the more the original color will be blended with the fog color.
  8. A Power node (raises the fog blend factor by an exponent) make the fog blending non-linear, that is beginning gently for closer objects and than increasing more drastically as the distance grows (provided that the exponent value is above 1)
  9. A Constant Vector4 serves as an input for the fog color.
    * Note that having this input be a Vector4 and not a Vector3 allows it to be interpolated with the PostProcessInput0 data, otherwise a ComponentMask (RGB) node would have been necessary to convert the PostProcessInput0 to a Vector3.
  10. a float constant serves as an input for the fog’s minimal distance (from camera)
  11. a float constant serves as an input for the fog’s maximal distance (from camera)
    *  Note that it’s connected both to the Clamp node and to the RemapValueRange node.
  12. a float constant serves as an input for the fog’s minimal opacity (blend amount)
  13. a float constant serves as an input for the fog’s maximal opacity (blend amount)
  14. a float constant serves as an input for the fog’s blend exponent.

 

Applying the Post Process material to the level:

Fog_2

  1. Select the PostProcessVolume actor in the World Outliner window.
    * Create a PostProcessVolume actor if necessary.
  2. In the Details panel, under Rendering Features > Post Process materials,
    Add a new item to the array, in the new item’s value choose Asset Reference,
    And then select your fog material:
    Annotation 2020-05-04 015354
    Annotation 2020-05-04 015831

 

Related:

  1. Material Functions
  2. Blending materials
  3. Blending materials using texture paint