Shadow Forge

Buat Bayangan Kotak CSS Secara Visual

Desain bayangan kotak indah dengan editor visual. Tambahkan banyak lapisan, kustomisasi offset, blur, spread, dan opasitas. Salin kode CSS secara instan.

16px

Lapisan Bayangan

Opasitas30%
Offset X0px
Offset Y4px
Blur15px
Spread0px

Kode CSS

box-shadow: 0px 4px 15px 0px rgba(99, 102, 241, 0.3);

Preset Bayangan

Cara Membuat Bayangan Kotak CSS

1

1. Tambah Lapisan Bayangan

Mulai dengan satu bayangan atau tambahkan banyak lapisan. Setiap lapisan dapat memiliki warna, offset, blur, spread, dan opasitas sendiri.

2

2. Kustomisasi Setiap Lapisan

Sesuaikan offset, radius blur, spread, dan opasitas. Aktifkan mode inset untuk bayangan dalam. Coba preset untuk inspirasi cepat.

3

3. Salin CSS-nya

Salin kode CSS yang dihasilkan dengan satu klik dan tempel langsung ke stylesheet Anda. Berfungsi di semua browser modern.

Pertanyaan yang Sering Diajukan

Apakah generator bayangan kotak CSS ini gratis?

Ya, 100% gratis tanpa batasan. Buat sebanyak mungkin bayangan yang Anda butuhkan tanpa registrasi.

Bisakah menambahkan banyak lapisan bayangan?

Bisa! Anda dapat menambahkan banyak lapisan dan mengkustomisasi masing-masing secara independen. Ini memungkinkan Anda membuat efek bayangan berlapis seperti Material Design atau neumorfisme.

Apa itu bayangan inset?

Bayangan inset muncul di dalam elemen, bukan di luar. Ini menciptakan efek cahaya dalam atau efek ditekan. Aktifkan tombol Inset pada lapisan bayangan mana pun.

Apakah data saya aman?

Tentu saja. Semua proses berjalan di browser Anda. Tidak ada data yang ditransmisikan ke server mana pun.

Jelajahi Alat Lainnya