Generator Gradasi CSS
Gawe kode gradasi CSS kanthi mratélakaké preview, mung kanthi milih werna lan sudut
Fitur
Preview lan kode dianyari bebarengan
Saben ngganti werna utawa sudut, tampilan lan CSS-né langsung melu owah
Ndhukung linear, radial, lan conic
Bisa ngatur rinci saben jinis, nganti sudut, wangun, lan posisi tengah
Nganti 10 werna bisa diatur kanthi drag
Posisi werna diatur kanthi drag ing bar, transparansi diatur kanthi slider
8 conto siap pakai lan generator acak
Wiwiti saka kombinasi werna standar utawa acak, banjur diatur luwih rinci
Cara Nggunakake
Pilih jinis
Pilih jinis gradasi: linear, radial, utawa conic
Tentokake werna
Pilih werna liwat kode werna utawa conto, banjur tambahi werna liwat "Tambah werna" sarta atur posisi lan transparansiné
Atur arah
Kanggo linear, atur sudut utawa tombol arah; kanggo radial lan conic, atur posisi tengah
Copy kode
Tekan tombol "Copy" banjur tempelake kode CSS siji baris kasebut menyang style dhewe
Conto Panganggo
Gawe latar belakang gambar hero
Nentokake werna latar ndhuwur situs utawa tombol tanpa nulis kode
Milih kombinasi werna judhul blog
Milih kombinasi werna sing cedhak saka conto kanggo ngatur latar judhul artikel
Overlay sing ditumpangake ing foto
Gawe lapisan setengah transparan ing ndhuwur foto nganggo werna sing transparansiné dikurangi
Ngatur gradasi multi-werna
Rapetake posisi wates antarane 3 werna utawa luwih kanthi drag sithik-sithik
Pengetahuan Dhasar
Bedane linear, radial, lan conic
Gradasi CSS nduwé telung fungsi kanthi cara owahing werna sing beda-beda, lan kabèh ditulis ing properti background.
- linear-gradient：linear-gradient yaiku gradasi linear sing werna-né owah miturut garis lurus kanthi sudut sing wis ditemtokake.
- radial-gradient：radial-gradient yaiku gradasi bunder sing werna-né nyebar saka posisi tengah metu arah njaba kanthi wangun bunder utawa oval.
- conic-gradient：conic-gradient yaiku gradasi wangun kipas sing werna-né owah kanthi muter siji puteran saka arah jam ing sakupenge posisi tengah.
Hubungane sudut lan tembung kunci arah
Sudut ing linear-gradient, 0deg iku arah saka ngisor munggah ndhuwur, lan saya gedhé angkané saya muter miturut arah jam. Sudut uga bisa ditulis nganggo tembung kunci arah kaya "to right"; 90deg padha karo "to right", lan 180deg padha karo "to bottom".
Cara nulis titik mandheg werna lan transparansi
Titik mandheg werna (color stop) yaiku posisi ing gradasi sing nduwé werna tartamtu, 0% minangka titik wiwitan lan 100% minangka titik pungkasan. Contoné, "#3B82F6 0%, #8B5CF6 100%" nuduhake owahing werna saka biru ing titik wiwitan menyang ungu ing titik pungkasan.
- Format #RRGGBB：Format #RRGGBB yaiku cara nulis werna sing nggambarake kekuwatan abang, ijo, lan biru nganggo angka heksadesimal rong digit saben-saben, lan #FF0000 nuduhake werna abang sing ora transparan.
- Format rgba：Format rgba yaiku cara nulis werna sing nambahake transparansi (0–1) ing nilai abang, ijo, lan biru (0–255); transparansi 0.5 nuduhake werna sing setengah tembus pandang.
Keamanan lan Privasi
Rampung ing browser
Data sing dilebokaké mung diolah ing njero browser sampéyan lan ora dikirim metu.
Diproses ing browser wae
Gawe kode gradasi kabeh ditindakake ing browser sampeyan, data input ora dikirim menyang server.
Komunikasi dienkripsi nganggo HTTPS
Pemuatan kaca uga dienkripsi nganggo TLS, mula isine ora bisa diwaca dening pihak katelu.
Ora dikirim menyang pihak katelu
Isi input ora dikirim menyang layanan eksternal kaya jaringan iklan utawa tracker.
Asil ora disimpen otomatis
Werna lan setelan sing dipilih lan kandidat input ora disimpen ing server.
Follow RAKKOTOOLS ing Panelusuran Google
184 piranti migunani bakal luwih gampang ditemokake liwat Panelusuran Google lan AI Search!
- Ditemokake ing panelusuran
- Uga katon ing AI Search
- Nemokake piranti anyar
Informasi pembaruan
- update #312
Nambahaké Generator Gradient CSS, milih werna lan sudut kanggo gawe kode