0%
100%
background: linear-gradient(135deg, #7c3aed 0%, #06b6d4 100%);

Alat terkait

Lanjutkan pekerjaan Anda dengan alat-alat ini.

Ekstrak Warna dari GambarPengekstrak palet warna gambarTemukan warna dari gambar untuk desain berikutnya.Kompres & Konversi GambarKompres & ubah format gambarAtur ukuran dan format gambar sebelum dibagikan.Encoder Base64 & URLEncode/decode Base64 · URLUbah teks ke Base64 atau format URL-encoded.
Lihat semua alat →

📐 Panduan Generator Gradien CSS

Generator Gradien CSS EVEDAYS adalah alat gradien visual gratis untuk desainer web dan developer front-end. Padukan warna secara real-time untuk langsung membuat kode gradien CSS yang menarik lalu menyalinnya. Jenis gradien yang didukung: • Linear: gradien paling umum yang menghubungkan dua titik dalam garis lurus. Sudutnya bisa diatur bebas dari 0° hingga 360°. • Radial: gradien melingkar yang menyebar dari tengah ke luar. Efektif untuk memberi kesan kedalaman pada tombol dan latar kartu. • Kerucut (Conic): gradien yang warnanya berubah dengan berputar di sekitar titik tengah. Dipakai untuk membuat diagram lingkaran dan roda warna. Fitur utama: • Banyak titik warna: tambahkan dua warna atau lebih untuk membuat gradien yang kompleks. • Pengaturan posisi: atur posisi (%) setiap titik warna secara detail dengan slider. • Preset: terapkan kombinasi gradien populer dengan satu klik. • Acak: buat kombinasi warna acak saat Anda butuh inspirasi. • Pratinjau langsung: semua perubahan langsung terlihat di pratinjau.

🎨 Tips Penggunaan

• Bagian hero situs web: memakai gradien linear sebagai latar memberi kesan pertama yang modern dan elegan. • Efek hover tombol: menerapkan gradien berbeda untuk keadaan normal dan hover memberi nuansa interaktif. • Gradien teks: dengan background-clip: text, Anda bisa menerapkan gradien pada teks. • Border kartu: menerapkan gradien pada border-image menghasilkan border yang elegan. • Animasi loading: menerapkan animation pada gradien kerucut menghasilkan indikator loading yang berputar.

💡 Pertanyaan Umum

T. Apakah gradien berfungsi di browser lama? J. linear-gradient dan radial-gradient didukung di semua browser modern, termasuk IE10+. conic-gradient didukung di Chrome 69+, Firefox 83+, dan Safari 12.1+. T. Berapa banyak titik warna yang bisa saya tambahkan? J. Tidak ada batasan teknis, tetapi 2–5 titik disarankan demi keterbacaan dan performa. T. Bolehkah kode yang dihasilkan dipakai untuk keperluan komersial? J. Tentu saja. Kode gradien CSS tidak dilindungi hak cipta, jadi Anda bebas memakainya.