CSS Art: Brazil’s traditional Festas Juninas

This content originally appeared on DEV Community and was authored by Antonio Silva

This is a submission for Frontend Challenge - June Celebrations, CSS Art: June Celebrations.

Inspiration

My inspiration came from Brazil's traditional Festas Juninas, a joyful and colorful celebration that takes place throughout the month of June. It's a time marked by flags, gangs, bonfires, typical food and lots of balloons in the sky. I wanted to capture this energy using only HTML and CSS, creating a small animated universe that harks back to childhood, community and dance.

Demo

Journey

I started with the simple idea of animated balloons floating around, but quickly wanted to bring the scene to life. I added variations in color, depth and movement using transform, z-indexand opacity, which brought a touch of realism and visual depth.

Then I felt that something was missing, so I included a dancing silhouette, representing the traditional quadrilha dances of the Festas Juninas. This part was a bit of a creative challenge with divs, clip-path, pseudo-elements and CSS animations to simulate the body in motion.

It was a fun exercise in pure CSS, without SVGs or JavaScript, which forced me to explore the limits of shapes and animations with native code. I was especially happy with the festive mood of the artwork and the visual atmosphere I managed to create.

💡 Team Submission: This is an individual creation. No team participated in this submission.

For the next steps, I'm thinking of making the artwork responsive, adding June music and perhaps integrating an interactive version with click and drag balloon events. I also want to experiment with dynamic shadows and bonfire lights!

This content originally appeared on DEV Community and was authored by Antonio Silva

Print Share Comment Cite Upload Translate Updates

APA

Antonio Silva | Sciencx (2025-06-29T00:34:41+00:00) CSS Art: Brazil’s traditional Festas Juninas. Retrieved from https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/

MLA

" » CSS Art: Brazil’s traditional Festas Juninas." Antonio Silva | Sciencx - Sunday June 29, 2025, https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/

HARVARD

Antonio Silva | Sciencx Sunday June 29, 2025 » CSS Art: Brazil’s traditional Festas Juninas., viewed ,<https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/>

VANCOUVER

Antonio Silva | Sciencx - » CSS Art: Brazil’s traditional Festas Juninas. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/

CHICAGO

" » CSS Art: Brazil’s traditional Festas Juninas." Antonio Silva | Sciencx - Accessed . https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/

IEEE

" » CSS Art: Brazil’s traditional Festas Juninas." Antonio Silva | Sciencx [Online]. Available: https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/. [Accessed: ]

rf:citation

» CSS Art: Brazil’s traditional Festas Juninas | Antonio Silva | Sciencx | https://www.scien.cx/2025/06/29/css-art-brazils-traditional-festas-juninas/ |

Please log in to upload a file.

There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.