⭐ 0
🔍
Teks Imej PDF & Dokumen Audio Muzik elektronik Masa Utiliti Pengesah Esoterik Permainan

CSS Shadow Kad — Kod bayangan kotak halus

Bina kod bayangan kotak CSS secara visual: peluncur untuk mengimbangi, kabur, hamparan, warna dengan kelegapan, mod inset dan sehingga empat lapisan dengan pratonton langsung.

0px
4px
12px
0px
0.25
Memproses... 0%

Hasilnya

Halaman ini membuka pratetap penjana bayang kotak kepada bayang kad klasik: 2px ke bawah, 8px kabur, 15% kelegapan hitam. Ia sengaja senyap — cukup untuk memisahkan kad daripada halaman tanpa mengumumkan dirinya sendiri — dan pratonton menunjukkan betapa senyapnya.

Julat ini sepadan dengan langkah ketinggian terendah dalam kebanyakan sistem reka bentuk: kad senarai, menu lungsur turun, popover dan baris jadual pada tuding. Jika anda memerlukan daya angkat yang lebih kuat untuk modal atau panel terapung, naikkan pengimbang Y dan kaburkan bersama-sama — ia harus berkembang mengikut perkadaran untuk memastikan sumber cahaya boleh dipercayai.

Salin garis bayang kotak ke dalam gaya komponen anda, atau salin garis itu sebagai lapisan kedua dengan kabur yang lebih ketat untuk menambah definisi tepi. Alat ini percuma dan berjalan sepenuhnya dalam penyemak imbas anda.

🛡️
Dilaksanakan dalam Pelayar

Fail dan input anda tidak pernah meninggalkan peranti ini. Pemprosesan berjalan sepenuhnya di luar talian. 100% Selamat.

Format & Peraturan yang Diterima

  • Peluncur untuk X/Y mengimbangi, mengaburkan dan menyebar dengan bacaan piksel langsung, serta pemilih warna dengan peluncur kelegapan yang berasingan.
  • Kotak semak inset dan senarai lapisan: tambah, pilih dan alih keluar sehingga empat lapisan bayangan.
  • Garis CSS bayang kotak boleh salin meliputi semua lapisan, dipratonton pada latar belakang terang atau gelap boleh tukar.

Faedah Utama

✓ Setiap peluncur mengemas kini kad pratonton dan baris CSS serta-merta — tidak meneka rupa 0 8px 24px rgba(...) sebenarnya.
✓ Sehingga empat lapisan bayang-bayang membolehkan anda membina ketinggian yang realistik dan kesan neumorfik yang tidak dapat diungkapkan oleh penjana bayang-bayang tunggal.
✓ Togol latar belakang terang/gelap menunjukkan cara bayang anda membaca pada kedua-dua tema sebelum anda menghantarnya.

Kes Penggunaan

  • • Dail dalam bayang ketinggian lembut untuk kad produk dengan menyeret peluncur dan bukannya mengedit nilai rgba() buta.
  • • Bina kesan neumorfisme terang/gelap dua lapisan dan salin keseluruhan garisan kotak-bayang berbilang lapisan dalam satu klik.
  • • Semak pada latar belakang pratonton gelap bahawa bayang anda masih membaca dalam mod gelap sebelum menghantar tema.