Alat Warna

Penjana Kecerunan CSS: Linear, Jejari dan Kon – Percuma

Percuma, tanpa daftar, berfungsi dalam penyemak imbas anda. Reka kecerunan linear, jejari atau kon dengan 2 hingga 8 hentian warna. Lihat secara langsung, salin kod CSS atau muat turun sebagai PNG.

Hentian warna

  • 0%
  • 100%

CSS

background: #ff7ac6;
background: linear-gradient(135deg, #ff7ac6 0%, #ffe14d 100%);

Baris pertama ialah warna pepejal untuk peranti lama yang tidak dapat memaparkan kecerunan.

Mula daripada pratetap

Dibuat pada peranti anda.

Mengapa guna Penjana Kecerunan CSS

100% percuma
Gunakan seberapa kerap yang anda mahu. Tanpa daftar, tanpa tera air, tiada apa perlu dipasang.
Peribadi mengikut reka bentuk
Apa yang anda taip kekal dalam penyemak imbas anda dan tidak pernah dihantar kepada kami.
Berfungsi pada mana-mana peranti
Berjalan dalam penyemak imbas anda pada Windows, Mac, Linux, Android dan iPhone. Tiada aplikasi diperlukan.

Cara guna Penjana Kecerunan CSS

  1. Pilih Jenis: Linear, Jejari atau Kon. Tetapkan arah dengan peluncur, atau pilih Bulatan atau Elips untuk kecerunan jejari.
  2. Di bawah Hentian warna, pilih setiap warna atau taip kodnya, dan seret peluncurnya untuk menetapkan kedudukannya. Guna Tambah hentian untuk lebih banyak warna, sehingga 8, dan Balikkan untuk menterbalikkan susunan.
  3. Atau klik salah satu pratetap di bawah Mula daripada pratetap dan ubahnya dari situ.
  4. Klik Salin CSS dan tampalkannya ke dalam helaian gaya anda, atau pilih Saiz imej dan klik Muat turun PNG.

Soalan lazim

Bagaimana saya menggunakan CSS?

Tampal kedua-dua baris ke dalam peraturan untuk elemen yang ingin diwarnakan, seperti body atau butang. Baris pertama ialah warna pepejal sandaran; yang kedua ialah kecerunan.

Apakah perbezaan antara linear, jejari dan kon?

Linear bercampur sepanjang garis lurus, jejari terpancar dari tengah dalam bulatan atau elips, dan kon berputar mengelilingi tengah seperti roda warna atau carta pai.

Bagaimana saya menukar arah kecerunan linear?

Seret peluncur Arah dari 0° hingga 360°. 0° bergerak dari bawah ke atas, 90° dari kiri ke kanan, 180° dari atas ke bawah, dan 135° bergerak secara pepenjuru ke arah kanan bawah.

Berapa banyak warnakah kecerunan boleh ada?

Dari 2 hingga 8 hentian warna. Setiap hentian mempunyai kedudukan dari 0% hingga 100%; letakkan dua hentian pada kedudukan yang sama untuk garis tegas antara warna dan bukannya percampuran.

Bolehkah saya guna kelutsinaran?

Boleh. Taip warna seperti rgba(47, 91, 255, 0.5) atau kod HEX 8 digit ke dalam satu hentian, dan kecerunan akan pudar menjadi lutsinar di situ.

Bolehkah saya muat turun kecerunan sebagai imej?

Boleh. Pilih 1920 × 1080, 3840 × 2160, 1080 × 1080, 1080 × 1920 atau 1500 × 500 dan klik Muat turun PNG, untuk kertas dinding, slaid, siaran media sosial atau pengepala.

Adakah CSS berfungsi dengan Tailwind, React atau WordPress?

Ya. Kodnya ialah CSS biasa, jadi letakkannya dalam kelas di helaian gaya anda (atau kotak CSS tersuai) dan tambahkan kelas itu pada elemen. Ia berfungsi dalam setiap pelayar moden.

Adakah apa-apa dimuat naik?

Tidak. Kecerunan dibuat pada peranti anda.

Adakah Penjana Kecerunan CSS percuma?

Ya. Ia percuma digunakan, tanpa daftar dan tiada apa perlu dipasang.

Panduan bantuan dan cara (dalam bahasa Inggeris)

Alat berkaitan