Summer CSS Clouds

Date

28 May, 2026

Category

code

Tags

CSS

My workplace has an in-house application for tracking vacation and sick leave. Long before my time, someone set up some CSS / JS so that in December, snowflakes gently drift down while you do your work. Beware October, when the UI is hidden behind shadow and you have to use your mouse as a flashlight to see.

A few months ago, feeling in a rainy day sort of mood, I adapted this Css Rain Codepen by Vishwa Offl so that our application would rain during the month of April. Thanks to William Nova for helping me with the CSS so that the rain drops don't interfere with the user's ability to scroll the page!

Receiving no particular pushback about the rain (possibly because of my inclusion of a seasonal "opt-out" user setting), the other day I decided it was time for a little bit of summer in our software.

I decided on Mark Boley's Pure CSS Animated Clouds Codepen and tossed the CSS into the repo to see what would happen. I didn't have to change anything this time around, it just worked perfectly out of the box! Check it out!