Apakah penghasil bayangan kotak CSS ini gratis?

Ya, sepenuhnya gratis. Tidak ada akun, tidak ada masa uji coba, tidak ada biaya tersembunyi — hanya buka halaman dan mulai menghasilkan bayangan.

Apakah ini berjalan offline, tanpa koneksi internet?

Ya. Alat ini berjalan sepenuhnya di browser Anda tanpa panggilan server. Setelah halaman dimuat, Anda dapat memutus koneksi internet dan akan terus berjalan sempurna.

Apakah data desain saya pribadi? Apakah sesuatu diunggah?

Tidak ada yang diunggah. Semua pengaturan bayangan diproses secara lokal di browser Anda dan hanya disimpan ke localStorage browser Anda. Tidak ada data yang pernah meninggalkan perangkat Anda.

Apakah saya dapat menumpuk beberapa bayangan dalam satu aturan CSS?

Ya. Klik '+ Tambahkan Bayangan' sebanyak yang Anda butuhkan. Alat ini menumpuk semua lapisan menjadi satu nilai box-shadow yang dipisahkan oleh koma — sempurna untuk neumorphism, efek cahaya, atau kedalaman multi-arah.

Bagaimana cara membuat efek bayangan inset (dalam)?

Centang kotak 'Inset' pada lapisan bayangan apa pun. Bayangan inset muncul di dalam batas elemen, berguna untuk status tombol yang ditekan atau efek cahaya dalam. CSS yang dihasilkan secara otomatis mencakup kata kunci 'inset'.

Apakah alat ini mengunggah data saya?

Tidak. Semuanya berjalan langsung di browser Anda, jadi data Anda tidak pernah meninggalkan perangkat — bahkan tetap bisa dipakai offline setelah halaman dimuat.

🔲 Penghasil Bayangan Kotak CSS

Dapatkan kode bayangan kotak CSS Anda dalam beberapa detik — tanpa instalasi, tanpa akun, tanpa koneksi internet. Tarik dan geser penggeser untuk menyetel offset, kabur, penyebaran, warna, dan opasitas untuk setiap lapisan bayangan, lihat pratinjau langsung diperbarui secara instan, lalu salin CSS yang siap tempel.

Pratinjau

Privat sejak awal. Alat ini berjalan sepenuhnya di browser Anda — tidak ada yang Anda masukkan diunggah atau disimpan, dan bisa dipakai offline.

Tentang

Alat ini berjalan sepenuhnya di browser Anda menggunakan JavaScript murni — desain Anda tidak pernah meninggalkan perangkat Anda. Anda dapat menumpuk beberapa lapisan bayangan untuk menciptakan efek kedalaman, neumorphism, efek cahaya, atau elevasi kartu yang halus. Setiap lapisan mendukung bayangan inset untuk efek cahaya dalam atau tampilan tombol yang ditekan. Outputnya adalah CSS standar yang dapat Anda masukkan langsung ke dalam stylesheet, kerangka kerja, atau token desain apa pun.

Cara pakai

Klik '+ Tambahkan Bayangan' untuk membuat lapisan bayangan pertama Anda.
Gunakan penggeser Offset X, Offset Y, Blur, Spread, dan Opacity untuk membentuk setiap bayangan. Toggle 'Inset' untuk efek bayangan dalam.
Klik swatch warna untuk memilih warna bayangan apa pun. Pratinjau langsung diperbarui saat Anda menyesuaikan setiap kontrol.
Tambahkan lapisan lebih lanjut untuk efek bayangan multi yang kompleks seperti neumorphism atau glows bertumpuk.
Klik 'Salin CSS' untuk mengambil deklarasi box-shadow lengkap dan tempelkannya ke dalam stylesheet Anda.

FAQ

Apakah penghasil bayangan kotak CSS ini gratis?: Ya, sepenuhnya gratis. Tidak ada akun, tidak ada masa uji coba, tidak ada biaya tersembunyi — hanya buka halaman dan mulai menghasilkan bayangan.
Apakah ini berjalan offline, tanpa koneksi internet?: Ya. Alat ini berjalan sepenuhnya di browser Anda tanpa panggilan server. Setelah halaman dimuat, Anda dapat memutus koneksi internet dan akan terus berjalan sempurna.
Apakah data desain saya pribadi? Apakah sesuatu diunggah?: Tidak ada yang diunggah. Semua pengaturan bayangan diproses secara lokal di browser Anda dan hanya disimpan ke localStorage browser Anda. Tidak ada data yang pernah meninggalkan perangkat Anda.
Apakah saya dapat menumpuk beberapa bayangan dalam satu aturan CSS?: Ya. Klik '+ Tambahkan Bayangan' sebanyak yang Anda butuhkan. Alat ini menumpuk semua lapisan menjadi satu nilai box-shadow yang dipisahkan oleh koma — sempurna untuk neumorphism, efek cahaya, atau kedalaman multi-arah.
Bagaimana cara membuat efek bayangan inset (dalam)?: Centang kotak 'Inset' pada lapisan bayangan apa pun. Bayangan inset muncul di dalam batas elemen, berguna untuk status tombol yang ditekan atau efek cahaya dalam. CSS yang dihasilkan secara otomatis mencakup kata kunci 'inset'.
Apakah alat ini mengunggah data saya?: Tidak. Semuanya berjalan langsung di browser Anda, jadi data Anda tidak pernah meninggalkan perangkat — bahkan tetap bisa dipakai offline setelah halaman dimuat.