Generator gradien & bayangan CSS
Buat gradien dan bayangan kotak sambil melihat pratinjaunya, lalu salin kode CSS.
Gradien
Anda dapat memakai 2 sampai 5 titik, dan keluarannya diurutkan menurut posisi dari terendah ke tertinggi.
Pratinjau
CSS yang dihasilkan
Bayangan kotak
Anda dapat memakai hingga 4 lapisan bayangan.
Pratinjau
CSS yang dihasilkan
Cara memakai generator gradien & bayangan CSS
Pratinjau dan kode CSS diperbarui segera setelah Anda mengubah nilai. Jika sudah puas dengan hasilnya, tekan Salin CSS dan tempel ke stylesheet Anda.
Batasan
- Warna hanya menerima hex dalam bentuk #RGB, #RGBA, #RRGGBB, atau #RRGGBBAA, dan # di depan boleh dihilangkan.
- Angka di luar rentang diatur ke nilai terdekat yang diizinkan. Sudut 0–360, posisi dan opasitas 0–100, offset dan spread -200 sampai 200, dan blur 0–200.
- Angka dipakai hingga 2 angka desimal.
- Gradien radial selalu berupa lingkaran yang menyebar dari tengah.
Pertanyaan umum
Apakah input saya dikirim ke server?
Tidak. Semuanya dihitung di dalam browser ini, dan input serta hasil Anda tidak disimpan maupun diunggah. Memuat ulang mengembalikan ke nilai awal.
Apakah mengubah urutan titik mengubah hasil?
CSS keluaran selalu diurutkan dari posisi terendah. Titik pada posisi yang sama mempertahankan urutan yang Anda masukkan.
Bagaimana opasitas diterapkan?
Jika warna bayangan memiliki alfa dalam hex 8 digit, alfa dikalikan dengan opasitas (%) dan dikeluarkan sebagai rgba(). Jika tidak transparan, dikeluarkan sebagai hex 6 digit.