The Elements Template

The user is shown with a water effect on their face.

Use the Elements template to add realistic visual effects to your Meta Spark effects. In particular, flames, water and air. In this article, we’ll show you how to edit and customize this template to create your own unique effect.

Opening the Elements template

To open the template:

  1. Open Meta Spark Studio.
  2. In the Welcome Screen, go to Create New > All Templates and select Elements from the list.
The Meta Spark Studio welcome screen.

Inside the template

The template contains a few different features and settings that can be easily adjusted to achieve a wide range of visual effects related to the elements.

3 blocks - water, fire and air

In the Scene panel there are 3 blocks - labeled water, fire and air. Each block contains a combination of features and settings that create the appearance of either water, fire or air. The effect will be applied to the whole scene.

Three blocks are highlighted in the Scene panel.

To edit the appearance of the water, fire and air effects, select each block and edit its properties in the Inspector. We’ll take a look at these properties in more detail later in this article.

Native UI Picker

This template features the the Native UI Picker. This is an interface along the bottom of the screen that lets the person using the AR effect change what they can see, by tapping a button:

The native UI picker buttons are highlighted in the Simulator.

In this case, the person using the effect can change whether water, fire or air is visible.

Render passes

Render Passes are used in this project to make the elements move in a more realistic way.

Using the template

Adjusting the 3 blocks

To change how the fire, air or water appears, select a block in the Scene panel and edit the properties listed under Inputs in the Inspector.

For example, below we’ve selected the fire block. Adjusting the slider next to Opacity makes the fire effect look more opaque:

Changing the opacity of the Fire block.

All 3 blocks have the same properties:

Color A, Color B and Color C

Change the color of the fire, air or water.

Noise Scale

Adjust the size of the swirling effect.


Control the size of the element. The stronger this setting is, the larger the element will appear.


Edit the strength and direction of gravity. Setting the slider to - 2 creates a strong upwards gravitational movement, while 2 creates a strong downwards force.

Heat Shimmer

The amount of distortion applied in the background of the image.


Control how transparent or opaque the effect appears.

Changing the Native UI textures

The Native UI appears as 3 textures at the bottom of the screen. To edit these textures:

  1. Go to the Assets panel.
  2. Right-click on the texture - for example, icon_air_blue.
  3. Select Replace.
  4. Choose another texture from your computer.
Replacing the texture.

You might need to click the Restart button in the toolbar to see the new texture in the Simulator.

Further customization

If you want to use just one of the elements in your effect, remove the blocks you don’t need from the Scene panel. You’ll need to reconnect the ‘output image’ of your chosen element (Fire, Water or Air purple producer patch) to the yellow Device Screen Output consumer patch in the Patch Editor You’ll need to reconnect the render pass patches to the Device Input patch in the Patch Editor.

For even more customization, you can experiment with adjusting patches in the Patch Editor.


Once you’ve finished editing the template, it’s time to export and upload it to Meta Spark Hub. Learn more about exporting and publishing effects.