Skip to main content
TikTok Effect House Platform Logo
Download
Log in
Face effects

Eye Color

Eye Color allows you to apply a color effect to a single eye or both eyes. You can also tweak the eye color or import external texture assets to apply on them.

↓ EyeColorTemplate.zip

Add Eye Color object

Add an Eye Color object by clicking + Add Object > Face Effects > Eye Color in the Hierarchy panel.

When Eye Color is added, an Eye Color Mask is automatically created and nested underneath it.

Tip
Tip

Eye Color Mask is used to determine which eye will be masked. This is a built-in setting, do not remove it.

Tip
Tip

You cannot modify the Transform of the Eye Color.

Make your own Eye Color texture

Paint the eye color

By default, there’s a mask artboard called eye mask[DO_NOT_REMOVE] and two artboards: eye reflection and eye color.

To design the eye texture, create a new layer under the artboard that has the same name as the makeup feature you want to customize in Effect House and draw on the newly created layer.

Export to Effect House

Select the artboard you want to export and go to File > Export > Artboard to Files.

Change the export settings to Artboard Content Only, check the Export Selected Artboards box, uncheck the Include Background in Export box, and change the File Type to PNG-24. Hit Run to confirm and export.

Import Eye Color image

You can import an image by clicking + Add Asset > Import > From Computer. You can also simply drag the image into the Assets panel.

Note
Note

See 2D Image preparation for a more detailed set up.

Image requirements

  • Format: Effect House supports .png and .jpg files
  • Resolution limit: 1024 x 1024 pixels
  • Single file size: Less than 1 MB
  • Total effect package: Less than 5 MB

Configure the Eye Color component

  • + Texture: This property controls the texture of the eye color. Click on the texture to choose your own asset.
    • Default Texture: Eye Color Texture.
  • Opacity Enable: Opacity Enable is disabled by default. Check it to set up the eye color Opacity Texture and Color.
    • + Opacity Texture: Choose the asset of the opacity texture.
    • + Color: Use this property to determine the color that will blend with the texture.
  • + Opacity: This slider will set the transparency of the texture.
    • Default: 0.5
    • Range: 0 is invisible, 1 will be a solid color.
  • Blend Mode: This property determines the blend mode. Choose different modes from the dropdown menu to determine different calculations used to blend color and texture.
    • Normal
    • Multiply
    • Overlay
    • Add
    • Screen
    • Soft Light
    • Average
    • Color Burn (Image blend mode don’t have)
    • Color Dodge (Image blend mode don’t have)
    • Darken
    • Difference
    • Exclusion
    • Lighten
    • Linear Dodge

Eye Reflection: Check this to enable/disable eye reflection Texture, Opacity, and Blend Mode.

  • + Texture: This property controls the texture of the eye reflection. Click on the texture to choose your own asset.
    • Default Texture: Eye Color Reflect.
  • + Opacity: This slider will set the transparency of the texture.
    • Default: 0.8
    • Range: 0 is invisible, 1 will be a solid color.
  • Blend Mode: Click the dropdown menu to choose from the list of blend modes.
    • Normal
    • Multiply
    • Overlay
    • Add
    • Screen
    • Soft Light
    • Average
    • Color Burn (Image blend mode don’t have)
    • Color Dodge (Image blend mode don’t have)
    • Darken
    • Difference
    • Exclusion
    • Lighten
    • Linear Dodge

+ Which Face Select the face that will be applied with the effect. Multiple Selections

  • Default: Select all.
  • Options:
    • 0 – 4
    • Face 0 represents the first face appearing in the scene; Face 4 represents the fifth face appearing in the scene.

Configure the Eye Color Mask component

Mask: Apply the eye color to the eye or eyes you select

  • Both Eyes
  • Left Eye
  • Right Eye

Use multiple Eye Colors

If you’re using multiple Eye Color objects on one person’s face, it will follow the Image’s render order.

Note
Note

See the 2D Image guide for more information on render order.