Penjana Kecerunan

Bina kecerunan linear, jejarian atau konik, tambah hentian warna dan tetapkan arah, kemudian salin CSS dalam satu klik.

Jenis kecerunan
Hentian warna
CSS
Laraskan hentian dan arah untuk membentuk kecerunan anda.

Setiap kecerunan dipaparkan terus dalam penyemak imbas anda. Tiada apa-apa yang anda tetapkan di sini akan dimuat naik ke BroBroGo.

Soalan Lazim

Apakah perbezaan antara kecerunan linear, jejarian dan konik?

Kecerunan linear mengadun warna di sepanjang garis lurus yang anda halakan dengan sudut. Kecerunan jejarian menyebarkannya ke luar dari pusat dalam bulatan atau elips. Kecerunan konik menyapu warna di sekeliling pusat seperti roda warna.

Apakah itu hentian warna?

Setiap hentian warna ialah warna yang disematkan pada kedudukan di sepanjang kecerunan — 0% pada permulaan, 100% pada penghujung. Alihkan hentian untuk beralih ke tempat puncak warnanya, atau tambah lebih banyak hentian untuk adunan yang lebih kaya. Anda boleh menggunakan sehingga lapan hentian.

Bagaimanakah cara saya mengawal arah?

Untuk kecerunan linear atau konik, gelongsor sudut menetapkan arah — 0° menghala ke atas, 90° menghala ke kanan. Kecerunan jejarian tidak mempunyai sudut; pilih bentuk bulatan atau elips untuk menukar cara ia merebak.

Penjana CSS Cubic BezierSeret dua pemegang untuk membentuk keluk pelonggaran, lihat titik bergerak melaluinya berbanding keluk yang stabil, dan salin nilai cubic-bezier().Penjana Box ShadowSeret gelongsor untuk membentuk box-shadow, susun lapisan untuk kedalaman, dan salin CSS yang telah siap serta-merta.Penjana Border RadiusBulatkan setiap bucu dengan gelongsor, bentuk gumpalan organik dengan mod elips, dan salin CSS serta-merta.Penjana FlexboxSediakan bekas flex dan itemnya dengan kawalan visual, lihat reka letak bertindak balas secara langsung, dan salin CSS dalam satu klik.Penjana CSS GridTetapkan lajur dan baris anda, seret merentasi sel untuk meletakkan item, dan salin CSS grid dengan HTML yang sepadan dalam satu klik.Kalkulator CSS clamp()Masukkan saiz untuk skrin kecil dan besar dan dapatkan nilai clamp() bendalir yang diskalakan dengan lancar di antaranya — untuk saiz fon, padding, margin atau gap.Penukar WarnaTukar warna antara HEX, RGB, HSL, HSV, CMYK dan LAB — edit mana-mana medan dan yang lain akan dikemas kini semasa anda menaip.Alat Perkemas & Kecilkan CSSSusun semula inden CSS yang berselerak untuk mudah dibaca, atau kecilkan saiznya untuk dilancarkan — dengan mod selamat yang tidak akan mengubah susunan peraturan anda.Pemeriksa KontrasMasukkan teks dan warna latar belakang untuk melihat nisbah kontras WCAG dan tahap AA serta AAA yang lulus.