Skip to main content
TikTok Effect House Platform Logo
Latest
Download
Log in
Post Effect

Filter

Use Filter to transform color inputs. You can make effects black and white or enhance your effect with some fun cinematic colors.

Download the following Effect House project file:

↓ Filter_SplitScreen.zip

Here are some filter textures you can use:

↓ Color_Cards.zip

↓ colorCard_Template.psd

↓ colorCard_dark.zip

Add a Filter Object

Add a Filter object to your scene by clicking the Add button [+] > Post Effect > Filter in the Hierarchy panel.

Note
Note

A Camera component is automatically included when a filter is added. This makes it easier to apply filters to that camera’s render texture.

Create a LUT Texture

A lookup table (LUT) contains a preset filter texture. You can easily apply a LUT filter to color grade your effect. You can use a built-in LUT asset for your filter effect or create your own.

Use a Built-In LUT Texture

You can use a built-in filter texture by clicking the Add button [+] > Texture > LUT Texture and selecting an option in the Assets panel.

Customize a Filter’s Texture

To create your own LUT filter texture, you can use an image editing application. In the following section, you’ll learn how to use Photoshop and the Colorcards_Template.psd file to make your own filter texture.

Check out the following demo video!

Download the following Photoshop file:

↓ colorCard_Template.psd

Here are some LUT textures you can download:

↓ Color_Cards.zip

First hide the DEFAULT COLORCARD layer and add new adjustment layers with the default photo.

Once you’re satisfied with the result, hide the photo layer and show the DEFAULT COLORCARD layer. Make sure the DEFAULT COLORCARD layer is below the color layer.

unaligned-image-0
unaligned-image-1

Save it as a PNG file.

unaligned-image-0
unaligned-image-1

Your end result should look like a color card similar to the following image:

Import a Texture

Import your prepared filter texture, or color card, by clicking the Add button [+] > Import > From Computer in the Assets panel. Learn more about the recommended texture specifications for your 2D image.

Apply a LUT Texture to Filter Texture

Click the Filter object in the Hierarchy panel to access its properties in the Inspector panel. Then replace Bright LUT Texture, the default texture, with your new imported texture.

Filter Properties

Tip
Tip

We recommend that you do not add components that depend on the Mesh Renderer component to the Filter object. Doing so will make the mesh invisible.

Texture: Select a built-in texture or use your own. The default is Bright LUT Texture, a bright color lookup up table texture.

Intensity: Adjust the intensity of the filter to a value between 0 and 1.

  • Default: 1.0
  • Range:
    • 0.00: No filter is applied
    • 1.00: Full filter is applied

Color Correction

The following color correction properties make it easier to tweak the filter without having to repeatedly edit the LUT:

  • Exposure
  • Contrast
  • Brightness
  • Saturation
  • Temperature
  • Tint

Demo Effect: Apply a Filter to Half of the Screen

In this demo, you’ll learn how to apply filters to a part of the screen.

Download the following Effect House project:

↓ Filter_SplitScreen.zip

Here is the dark-colored filter texture:

↓ colorCard_dark.zip

Follow along with this tutorial video:

  1. Add a Filter object by clicking the Add button [+] > Post Effect > Filter in the Hierarchy panel.
  2. Create a Render Texture by clicking the Add button [+] > Texture > Render Texture in the Assets panel.
  3. Select the new Render Texture in the Assets panel and change the Input Texture property to Final Render Output in the Inspector panel.
  4. Select the Filter object in the Hierarchy panel to see the Camera component in the Inspector panel.
  5. Replace the default Render Texture with the new Render Texture.
  6. Add a 2D image by clicking the Add button [+] > 2D > Image in the Hierarchy panel.
  7. Select the new Image object in the Hierarchy panel and change the Texture property to the new Render Texture in the Inspector panel.
  8. Expand Advanced Settings and change Draw Mode to Filled in the Inspector panel.
  9. Adjust the Start Point value to 0.5.