Efek Salju CSS — Salju Turun untuk Websitemu

Biarkan salju turun di websitemu saat liburan: salju lembut atau kepingan salju, gerimis ringan atau badai salju. Salin cuplikan CSS kecil — tanpa library, tanpa gambar, dan tidak pernah menghalangi klik.

Diperbarui

Data kamu tidak pernah meninggalkan komputer kamu. Semua proses berjalan 100% secara lokal di browser kamu.

Apakah alat ini membantu?0.0 0 penilaian
Buat salju, hujan, bintang jatuhConfetti, daun, atau gelembung jatuh di websitemu.Generator Animasi Partikel →

Cara menggunakan Efek Salju CSS

  1. Pratinjau dimulai dengan Salju; pilih Kepingan salju untuk kepingan dengan enam lengan.
  2. Atur jumlah kepingan, ukuran dan kecepatannya; tambahkan Angin agar salju terbawa hembusan.
  3. Pilih seluruh halaman atau hanya satu bagian.
  4. Salin kodenya dan tempelkan sebelum </body>.

Efek salju tanpa library

Salju adalah kumpulan titik kecil yang sedikit blur dan jatuh dengan kecepatan berbeda — kepingan yang lebih kecil jatuh lebih lambat, sehingga terlihat lebih berkedalaman — sementara setiap titik bergoyang lembut ke kiri dan kanan. Semuanya berjalan dengan animasi CSS pada transform, jadi tetap halus dan ringan. Lapisan overlay menggunakan pointer-events: none agar tautan dan tombol tetap bisa diklik.

Efek lain — hujan, bintang jatuh, confetti, atau SVG buatanmu sendiri — tersedia di Generator Animasi Partikel.

Juga dicari sebagai: animasi salju turun css, salju turun website, efek salju html, efek salju natal, animasi kepingan salju css, efek salju javascript.

Tool yang cocok dipakai bersama Efek Salju CSS

  • Animasi Hujan CSS — Buat halaman atau bagian hero kamu hujan — dari gerimis tipis hingga hujan deras yang miring.
  • Animasi Bintang Jatuh — Tampilkan shooting star yang melesat di latar langit malam, atau biarkan bentuk bintang melayang turun dan berputar.
  • Confetti Animation CSS — Rayakan peluncuran, pendaftaran atau ulang tahun dengan konfeti jatuh yang berkibar dan berputar dalam berbagai warna.
  • Generator CSS Keyframes — Editor visual untuk @keyframes.

Pertanyaan yang sering diajukan

Bagaimana cara menambahkan salju ke websiteku untuk Natal?
Salin HTML + CSS di sini lalu tempelkan tepat sebelum tag body penutup, atau ke dalam blok Custom HTML / Embed di WordPress, Webflow atau Shopify. Hapus kembali setelah musim liburan selesai.
Apakah salju akan menghalangi klik?
Tidak. Lapisan overlay menggunakan pointer-events: none, jadi pengunjung tetap bisa mengklik apa pun di bawahnya.
Bisakah saljunya hanya turun di header?
Bisa — pilih Satu bagian, tempelkan kodenya di dalam header, lalu beri header position: relative.
Bisakah saya memasang Efek Salju CSS sebagai aplikasi web dan memakainya offline?
Bisa. Efek Salju CSS adalah aplikasi web (PWA) yang bisa dipasang. Pemasangannya lewat browser kamu, bukan diunduh dari toko aplikasi. Klik Pasang aplikasi di bagian atas halaman ini di Chrome atau Edge (Windows, macOS, Linux, ChromeOS) atau di Android. Di iPhone dan iPad, gunakan Bagikan → Tambahkan ke Layar Utama, dan di Safari 17+ pada Mac, gunakan File → Tambahkan ke Dock. Setelah itu, aplikasi akan terbuka di jendelanya sendiri dengan ikonnya sendiri. Karena berjalan sepenuhnya di browser kamu, aplikasi ini tetap bisa dipakai offline. Firefox di desktop tidak bisa memasang aplikasi web. Cara memasang aplikasi.

Tool terkait