Skip to main content

Top Level Prefabs

Background

Usage

You can use a solid color:

{
"background": {
"color": "1 0 0 1"
}
}

Alternatively, use a texture:

{
"background": {
"texture": "capy.jpeg",
"rotation": 0,
"scale": 1,
"content_mode": "scale_to_fill",
"blend_mode": "default",
"clear_color": "1 0 0 1",
"use_filter": true
}
}

To blur the camera background:

{
"background": {
"blur": 0.5
}
}

To make the background transparent:

{
"background": {
"transparency": 0.5
}
}

Use this prefab to create a virtual background.

ParameterDescriptionOptionalDefault Value

color

Sets a solid background color. See the color-format note in the prefabs overview.

`${props.title} icon`

"0 0 0 0"

transparency

Sets the background transparency to a value from 0 to 1.

`${props.title} icon`

0.0

texture

Sets an image or video file as the background texture. For best performance, use .jpeg, .jpg, .png, or .mp4 (H.264 video with AAC audio). You can also use formats such as .heic, .webp, and .webm, but performance may vary by device. For more information, see the supported image formats and video formats.

`${props.title} icon`

null

rotation

Rotates the background texture clockwise in degrees.

`${props.title} icon`

0.0

scale

Scales the background texture.

`${props.title} icon`

1.0

content_mode

Fits the background texture within the frame. Possible values are scale_to_fill, fill, and fit.

`${props.title} icon`

"fill"

blend_mode

Sets the texture blending mode. Possible values are default, screen, split_alpha, and multiply. default uses traditional alpha blending; split_alpha expects the alpha channel on the right side of the input texture.

`${props.title} icon`

"default"

blur

Sets the background blur radius in the range [0, 1].

`${props.title} icon`

0.0

clear_color

Specifies the color of the area not covered by the background texture, such as when content_mode is fit. The default is black. The final alpha component is currently ignored; use 1.

`${props.title} icon`

"0 0 0 1"

camera_video_scale

[Experimental] Sets the scale factor for the camera image relative to the center of the image.

`${props.title} icon`

"1 1"

camera_video_origin

[Experimental] Sets the offset of the camera image relative to the center of the image.

`${props.title} icon`

"0 0"

use_filter

Enables or disables a filter that smooths segmentation-mask contours.

`${props.title} icon`

true

Preview

Right image compareLeft image compare
Drag

Foreground

Usage Apply a texture or a video to the whole screen.

{
"foreground": {
"filename": "path/to/texture/file",
"@blend": "multiply",
"rotation": 0,
"content_mode": "scale_to_fill"
}
}
ParameterDescriptionOptionalDefault Value

filename

Path to a texture or video file. A texture must have a suitable alpha channel; otherwise, like a video, it hides the underlying content. For more information, see the supported image formats and video formats.

++

@blend

Applies the selected blending mode. The leading @ in the parameter name is required. Possible values are off, alpha, premul_alpha, alpha_rgba, screen, add, multiply, min, and max.

`${props.title} icon`

"alpha"

rotation

Rotates the foreground clockwise in degrees.

`${props.title} icon`

0.0

content_mode

Fits the foreground texture within the frame. Possible values are scale_to_fill, fill, and fit.

`${props.title} icon`

"scale_to_fill"

LUT

Usage Apply a color filter, also known as a LUT.

{
"lut": {
"filename": "path/to/lut/file",
"strength": 0.9
}
}
ParameterDescriptionOptionalDefault Value

filename

Path to the LUT file (usually PNG).

++

strength

LUT strength in the range [0, 1].

`${props.title} icon`

1.0

Preview

Right image compareLeft image compare
Drag

Lights

Usage Add up to four directional light sources to GLTF models in addition to IBL textures. A GLTF model is required.

{
"lights": {
"radiance": [
"10 0 0 0",
"0 0 10 0"
],
"direction": [
"-1 0 0",
"1 0 0"
]
}
}
ParameterDescriptionOptionalDefault Value

radiance

An array of light-source radiance values, or a single value for one light. Each value contains R, G, and B components followed by a light wraparound factor.

`${props.title} icon`

["0 0 0 0", "0 0 0 0", "0 0 0 0", "0 0 0 0"]

direction

An array of light-source directions, or a single direction for one light. Each direction contains X, Y, and Z components.

`${props.title} icon`

["0 0 0", "0 0 0", "0 0 0", "0 0 0"]

MSAA

Usage Apply multisample anti-aliasing to the effect. MSAA makes the image look cleaner by smoothing jagged edges. A GLTF model is required. The @samples_count parameter is required.

{
"msaa": {
"@samples_count": 4
}
}
ParameterDescriptionOptionalDefault Value

@samples_count

Required MSAA sample count. The value must be 1, 2, or 4. A value of 1 disables MSAA.

++

Bokeh

Usage Enable the bokeh effect for the background.

{
"bokeh": {
"samples": 16
}
}
ParameterDescriptionOptionalDefault Value

samples

Sample count in the range [8, 24]. Higher values produce a stronger bokeh effect.

`${props.title} icon`

16

Preview

Right image compareLeft image compare
Drag