Collection of hand-picked free HTML and pure CSS cloud code examples from Codepen and other resources.

Demo image: Easy Cloud

Author

  • NANOUU

Made with

  • HTML / CSS

About a code

Easy Cloud

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Ruslan Pivovarov

Made with

  • HTML / CSS (SCSS)

About a code

Grumpy Clouds

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Fernando Forero

Made with

  • HTML / CSS

About a code

Drifting Clouds

Simple cloud animation.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • vavik

Made with

  • HTML (Haml) / CSS (SCSS)

About a code

SCSS Cloud

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Mathieu Lajoinie

Made with

  • HTML (Haml) / CSS (SCSS)

About a code

Clouds

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Johan Linder

Made with

  • HTML / CSS (SCSS)

About a code

Rainy Cloud

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Mark Bowley

Made with

  • HTML / CSS

About a code

Pure CSS Animated Clouds

Animated clouds using nothing but HTML and CSS.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Valentin Radulescu

Made with

  • HTML / CSS

About a code

CSS3 Clouds Background Animation

A nice simple CSS3 background animation of moving clouds.

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Oscar Bustos

Made with

  • HTML / CSS

About a code

Clouds CSS3 Transition Infinite Loop

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Author

  • Kevin Jannis

Made with

  • HTML / CSS (SCSS)

About a code

Clouds

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: yes

Dependencies: -

Demo image: Clouds

Author

  • Jeya Karthika

Made with

  • HTML / CSS

About a code

Clouds

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -

Author

  • Rahim Afshary

Made with

  • HTML / CSS

About a code

Cloud

Compatible browsers: Chrome, Edge, Firefox, Opera, Safari

Responsive: no

Dependencies: -