Penjana Gradien - Editor Gradien CSS Visual
Reka bentuk gradien linear dan radial secara visual. Tambah hentian warna, laraskan sudut, pratonton secara langsung, dan salin CSS. percuma.
프리셋
Apakah Itu Penjana Gradien?
Penjana gradien ialah editor visual untuk mencipta gradien CSS. Daripada menulis kod gradien secara manual, anda memilih warna, menetapkan kedudukan dan melaraskan sudut — alat ini menjana CSS dalam masa nyata. Ia menyokong kedua-dua gradien linear (dengan kawalan sudut) dan gradien radial (dengan kawalan titik tengah), menjadikannya mudah untuk mencipta peralihan warna yang lancar untuk latar belakang, butang dan elemen UI.
Cara Mencipta Gradien CSS
- Pilih jenis — Pilih gradien Linear atau Radial
- Tetapkan arah — Laraskan sudut (linear) atau titik tengah (radial)
- Edit hentian warna — Tukar warna dan seret peluncur kedudukan
- Tambah lebih banyak hentian — Klik "+ Tambah Hentian" untuk gradien kompleks (sehingga 8)
- Salin CSS — Klik butang Salin untuk mendapatkan kod CSS
Mengapa Menggunakan Penjana Gradien Ini?
- Editor Visual — Lihat gradien anda dikemas kini dalam masa nyata semasa anda melaraskan
- Linear & Radial — Kedua-dua jenis gradien dengan kawalan penuh
- Berbilang Hentian — Tambah sehingga 8 hentian warna untuk gradien kompleks
- Pratetap — 8 gradien pratetap yang cantik untuk bermula
- CSS Satu Klik — Salin kod CSS sedia pengeluaran serta-merta
FreeToolbox vs Alat Gradien Lain
| Ciri | FreeToolbox | cssgradient.io | WebGradients |
|---|---|---|---|
| Pratonton Langsung | Ya | Ya | Statik sahaja |
| Hentian Warna | Sehingga 8 | Tanpa had | 2 (tetap) |
| Sokongan Radial | Ya | Ya | Tidak |
| Pratetap | 8 | Tiada | 180 |
| Iklan | Minimum | Sederhana | Minimum |
Soalan lazim
Apakah perbezaan antara gradien linear dan radial?
Gradien linear beralih di sepanjang garis lurus pada sudut yang ditentukan. Gradien radial beralih ke luar dari titik tengah dalam bentuk bulat atau elips.
Berapa banyak hentian warna yang boleh saya tambah?
Sehingga 8 hentian warna. Anda memerlukan sekurang-kurangnya 2 hentian untuk membentuk gradien. Klik '+ Tambah Hentian' untuk menambah lebih banyak.
Bolehkah saya membuang hentian warna?
Ya. Klik butang × di sebelah mana-mana hentian untuk membuangnya, selagi sekurang-kurangnya 2 hentian kekal.
Bagaimana saya menggunakan pratetap?
Klik mana-mana lakaran kecil pratetap di bahagian bawah. Ia memuatkan warna pratetap dan menetapkan jenis gradien kepada linear pada 135°. Anda kemudian boleh menyesuaikannya lagi.
Adakah ini menjana CSS merentas pelayar?
CSS yang dijana menggunakan sintaks gradien standard yang disokong oleh semua pelayar moden (Chrome, Firefox, Safari, Edge). Tiada awalan vendor diperlukan.