Bebas Terbaik Penjana Bayang Kotak CSS

Bina bayang kotak CSS secara visual dengan pralihat hidup, inset dan lapisan kedua - salin kod.

100% percuma Tiada pendaftaran Tiada tanda air
Pergi Pro untuk model AI terbaik - imej, video dan sembang - ditambah muat naik yang lebih besar, keutamaan dalam baris gilir dan tiada menunggu. Naik taraf ke Pro
Cinta Best.Free? Bagikan

Bagaimana ia berfungsi

  1. Alih slider. Tetapkan ofset, kabur, lebar, warna dan kelegapan; togol inset jika anda mahu bayang dalaman.
  2. Lihat pralihat. Kotak hidup dikemaskini bila anda seret; tambah lapisan kedua dalam pilihan Lanjutan untuk kedalaman.
  3. Salin CSS. Tekan Salin CSS dan tampal peraturan kotak-bayang ke dalam lembaran gaya anda.

Perihal alat ini

Reka bentuk bayang-kekotak tanpa meneka nilai piksel. Seret ofset-X, ofset-Y, kabur dan penyelars sebarkan, pilih warna bayang dan dial dalam kelegapannya, dan lihat kemaskini kotak pralihat hidup dalam masa nyata - kemudian salin CSS bayang-kekotak tepat. Balikkan togol inset untuk bayang dalaman. Pilihan Lanjutan mengumpul lapisan bayang kedua, jadi anda boleh bina bayang-bayang lembut, berlapis-banyak yang digunakan pada kad dan butang moden. Semuanya berjalan dalam pelayar anda.

Apa yang orang gunakan untuk

  • Tambahkan bayang jatuh lembut ke kad dan modal
  • Cipta bayang dalaman (inset) untuk input dan lubang
  • Tumpukan dua lapisan untuk bayang yang realistik dan tersebar
  • Tetapkan ofset dan kabur untuk sepadan dengan mockup rekaan

Pertanyaan yang kerap ditanya

Ofset-X/Y alihkan bayang secara melintang dan menegak, kabur melembutkan tepinya, dan lebar tumbuh atau mengecilkan keseluruhan bayang sebelum kabur dilaksanakan. Pralihat langsung menunjukkan setiap perubahan dengan serta merta.

Inset melukis bayang di dalam unsur bukan di belakangnya, memberikan penampilan ditekan-dalam - berguna untuk input dan togol. Balikkan togol inset untuk togol.

Pilih warna, kemudian gunakan pelaris kelegapan; alat output nilai rgba () supaya bayang bercampur secara semulajadi.

Ya. Buka pilihan Lanjutan untuk mengaktifkan lapisan bayang kedua dengan ofset, kabur, warna dan inset sendiri.

Tidak. Penjana berjalan sepenuhnya dalam pelayar anda; pelaris hanya mengira rentetan CSS secara setempat.

Semulajadi percuma, tiada akaun dan tiada had - alat klien-sisi tanpa apa-apa untuk diukur.

Ya. Ia berjalan dalam pelayar anda, jadi Penjana Bayang Kotak CSS berfungsi pada telefon dan tablet serta desktop - tiada aplikasi untuk dipasang.

Biasanya hanya beberapa saat untuk fail tipikal - Penjana Bayang Kotak CSS mula bekerja bila anda memberikan input anda.

Penggunaan biasa tidak terhad, di bawah cap penggunaan adil yang baik yang menjadikannya pantas untuk semua orang.

Semua pelayar moden - Chrome, Safari, Firefox dan Edge. Penjana Bayang Kotak CSS tidak memerlukan apa-apa dipasang selain pelayar yang anda sudah gunakan.

Alat berkaitan

Nilai halaman ini
5.0/5 (0)

Apa yang boleh kami perbaiki?