CSS Visual ToolsLesson 82Preview gratis
Glassmorphism Generator
Lesson ini bagian dari Web Developer Tools · Semua level
Ringkasan
Glassmorphism generator membantu membuat efek kaca buram dengan latar semi-transparan dan backdrop-filter blur. Efek ini biasanya dipadukan dengan border tipis terang dan bayangan lembut agar kartu terlihat melayang di atas latar. Pastikan kontras teks tetap cukup karena latar transparan dapat menurunkan keterbacaan.
Poin kunci
- backdrop-filter: blur() memburamkan isi di belakang elemen
- Latar kartu memakai warna semi-transparan dengan alpha rendah
- Border tipis terang mempertegas tepi kaca
- Bayangan lembut membantu memisahkan kartu dari latar
- Sediakan warna latar fallback untuk browser tanpa dukungan
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.