---
title: "How to Add Particle Effect to a WordPress Container Background?"
url: https://qa.nexterwp.com/docs/add-particle-effect-to-a-wordpress-container-background/
date: 2024-11-28
modified: 2026-05-14
author: "Aditya Sharma"
description: "Do you want to add a particle effect to a section in WordPress? Particle effects create animated motion in a container background, adding depth and interactivity to hero sections, banners,..."
image: https://qa.nexterwp.com/wp-content/uploads/2024/11/How-to-Add-Particle-Effect-to-a-WordPress-Container-Background-1024x519.jpg
word_count: 273
---

# How to Add Particle Effect to a WordPress Container Background?

## Key Takeaways

- Nexter Blocks' Container block enables the addition of particle animation to any section background in WordPress.
- Canvas Effect is selected from the Select Background Option dropdown to apply particle effects in the Container block settings.
- Custom Skin option allows users to input particle JSON code for personalized particle effects, enhancing visual identity.

Do you want to add a particle effect to a section in WordPress? Particle effects create animated motion in a container background, adding depth and interactivity to hero sections, banners, and feature areas without any custom code.

With the [Container block](https://qa.nexterwp.com/docs/add-a-container-in-wordpress/) from Nexter Blocks, you can add particle animation to any section background in WordPress.

**Best Used For:**

- Hero sections and banner areas where animated particles make the first impression more engaging

- Feature or service sections where subtle motion in the background adds visual distinction without competing with the content

- Landing pages where a custom particle skin with brand colors reinforces visual identity

*To check the complete feature overview documentation of the Nexter Blocks Container block, [click here](https://qa.nexterwp.com/docs/add-a-container-in-wordpress/).*

***Requirement – This block is a part of Nexter Blocks. Make sure it is installed and activated.***

[LIVE BLOCK LINK](https://qa.nexterwp.com/nexter-blocks/blocks/wordpress-container/)

Add the Container block with the appropriate layout to the page and follow the steps.

1. Go to **Style** > **Background Middle Layer**.

2. Select **Canvas Effect** from the **Select Background Option** dropdown.

3. Then from the **Canvas Style** dropdown list, choose a predefined effect or add a custom effect by selecting the **Custom Skin** option.

You will get options to change the particle color along with some additional settings for some effects.

> *Note:* *To use the Custom Skin option you have to add the particle json code, for this, you can use this *[*particle generator*](https://vincentgarreau.com/particles.js/)*.*

Now you will see an animated particle background.

> *Note:* *For better visibility, you can add a normal background color to the container.*

To explore other container background options in Nexter Blocks, see the [Parallax Effect](https://qa.nexterwp.com/docs/add-parallax-effect-to-a-container-in-wordpress/) and [Video Background](https://qa.nexterwp.com/docs/add-a-video-background-in-a-wordpress-container/) docs.