Fix: Construct 3 Sprite Not Showing / Invisible on Layer

Here is how to fix a Construct 3 sprite that is not showing on a layer. You placed a sprite on the layout, gave it an animation, and ran the project — but the sprite is nowhere to be seen. It exists in the object list, events reference it without error, and collision still works. But visually it is invisible. This is one of the most common layout debugging issues in Construct 3, and it almost always comes down to one of six specific property mistakes.

The Symptom

You have a Sprite object placed on a layout. In the editor, it may or may not be visible depending on the cause. When you preview the project, the sprite does not appear on screen. You might confirm the object exists by adding a debug text that displays the sprite’s X and Y position — it reports valid coordinates, but nothing renders at that location.

In some cases, the sprite is visible in the layout editor but invisible at runtime. In other cases, it is invisible in both. Collisions and event logic may still function correctly, which makes this even more confusing — the object is there, it just cannot be seen.

You might also notice that the sprite appears briefly during a layout transition and then vanishes, or that it shows up on one layout but not another despite using the same object type.

What Causes This

There are six common causes, listed by frequency:

1. Layer visibility is off. Every layer in Construct 3 has a visibility toggle (the eye icon in the Layers panel). If the layer your sprite is on has visibility turned off, every object on that layer will be invisible at runtime. This is the single most common cause because developers frequently toggle layer visibility while editing and forget to turn it back on.

2. Sprite opacity is 0. The sprite instance or the entire layer may have its opacity set to 0. Construct 3 treats opacity as a 0-100 scale. An opacity of 0 means fully transparent. This can happen if an event sets opacity to 0 at startup or if you accidentally typed 0 instead of 100 in the properties panel.

3. “Initially visible” is unchecked. Each object instance has an “Initially visible” property in the Properties panel. If this is set to No, the sprite will exist but will not be rendered when the layout starts. You must explicitly use a “Set visible” action to show it.

4. Z-order is behind another object. If an opaque sprite or a Tiled Background sits in front of your sprite on the same layer, it will completely cover it. The Z-order within a layer determines the draw order, and objects lower in the Z-order are drawn first (behind).

5. Parallax 0,0 layer confusion. Layers with parallax set to 0,0 do not scroll with the camera. If you place a game-world sprite on a UI layer (parallax 0,0) or vice versa, the sprite may be positioned off-screen relative to the camera’s viewport at runtime, even though it looks correct in the layout editor.

6. Blend mode set to wrong value. Blend modes like “Destination out” or “Destination atop” can make sprites invisible or appear as cutouts. If a blend mode was accidentally changed from “Normal,” the sprite will not render as expected.

The Fix

Step 1: Check layer visibility and opacity. Open the Layers panel (View > Bars > Layers bar). Make sure the eye icon is enabled for the layer containing your sprite. Then select the layer and check its Opacity property — it should be 100.

// Event sheet: Force layer visible at start
// System > On start of layout
Condition: System > On start of layout
Action:   System > Set layer "Game" visible
Action:   System > Set layer "Game" opacity to 100

Step 2: Verify the sprite’s Initially visible property. Click the sprite instance on the layout. In the Properties panel on the left, find “Initially visible” and set it to “Yes.” If you need it to start hidden and appear later, use an event:

// Make a hidden sprite visible after a condition
Condition: System > On start of layout
Action:   Sprite > Set visible > Visible

// Or toggle visibility based on a variable
Condition: System > Compare variable > showPlayer = 1
Action:   Player > Set visible > Visible

Step 3: Fix opacity. Select the sprite instance and check the Opacity property in the Properties panel. It should be 100 (or whatever value you want). Also search your event sheets for any action that sets the sprite’s opacity:

// Debug: log the sprite opacity at runtime
Condition: System > Every tick
Action:   Text > Set text to Sprite.Opacity

Step 4: Adjust Z-order. Right-click the sprite on the layout and select Z Order > Send to front of layer. Or control it via events:

// Ensure sprite is on top within its layer
Condition: System > On start of layout
Action:   Sprite > Move to top

Step 5: Check layer parallax and placement. Select the layer in the Layers panel and inspect the Parallax X and Parallax Y values. Game-world layers typically use 100,100 (scroll with camera). UI layers use 0,0 (fixed position). Make sure your sprite is on the correct layer type.

// Move a sprite to the correct layer at runtime
Condition: System > On start of layout
Action:   Sprite > Move to layer "Game"

Step 6: Reset blend mode. Select the sprite instance and find the Blend mode property. Set it back to “Normal.” The most common accidental settings are “Destination out” (which creates transparency cutouts) and “Source atop” (which only draws over existing pixels on the layer).

// Reset blend mode via events if needed
Condition: System > On start of layout
Action:   Sprite > Set blend mode > Normal

Why This Works

Each fix addresses a different stage of Construct 3’s rendering pipeline:

Layer visibility is the first gate. If a layer is invisible, the renderer skips every object on that layer entirely. No draw calls are issued, no blend operations run. Enabling visibility allows the layer to participate in rendering.

Opacity controls the alpha channel of either the individual sprite or the entire layer. At 0, the object is fully transparent — it exists in the scene graph and participates in collisions and event logic, but the GPU discards all its pixels during compositing.

Initially visible is a convenience property that tells the runtime whether to set the object’s visibility flag to true or false when the layout loads. It is equivalent to calling “Set visible” on tick 0, but it happens before any events run.

Z-order determines draw order within a layer. Objects drawn first are covered by objects drawn later. Moving your sprite to the top ensures nothing on the same layer obscures it.

Parallax correction ensures the sprite’s world-space coordinates map to the correct screen-space coordinates. A sprite at position (2000, 1000) on a parallax 0,0 layer will be off-screen if the viewport is 1920x1080, because parallax 0,0 means the layer does not scroll — position (0,0) is always at the top-left of the screen.

Blend mode reset restores normal alpha compositing. Exotic blend modes alter how the sprite’s pixels combine with the pixels behind them, and several modes (Destination out, Destination atop, Source in) will produce fully transparent output if there is nothing underneath them on the same layer.

"The invisible sprite problem is almost never a bug in Construct — it is always a property set to the wrong value. Check layer visibility and Initially visible first. Those two cover 80% of the cases I have seen."

Related Issues

If your sprite appears but flickers or disappears during scrolling, the issue is likely related to performance and rendering lag. If the sprite shows in preview but not in an exported build, see our guide on exported games not running. And if touch or click events do not register on visible sprites, check our post on touch input not working on mobile.

Check the eye icon. It is always the eye icon.