Gjenerues Gradientësh CSS Falas

Si funksionon

Gjeneruesi i gradientëve ndërton vargje gradientësh CSS direkt në shfletues — pa bibliotekë, pa server, pa ngarkim. Një funksion i shkruar me dorë monton sintaksën e saktë linear-gradient, radial-gradient, ose conic-gradient nga ndalesat e ngjyrave dhe këndi yt në kohë reale, pastaj e formaton rezultatin për çdo objektiv dalje që zgjedh.

1. 1
   Konfiguro ndalesat dhe drejtimin

   Vendos mes 2 dhe 6 ndalesa ngjyrash duke përdorur zgjedhësin vendas të ngjyrave të shfletuesit, pastaj pozicionon çdo ndalesë përgjatë aksit 0–100% me një rrëshqitës intervali. Për gradientë linearë dhe konikë zgjedh gjithashtu një kënd (0–360°); për gradientë radialë zgjedh formën (elips ose rreth) dhe fjalën kyçe të madhësisë që kontrollon sa larg shtrihet gradienti.
2. 2
   buildCss monton vargun e gradientit

   Në çdo ndryshim, një funksion lokal buildCss i bashkon parametrat e tu në thirrjen e saktë të funksionit CSS — p.sh. linear-gradient(135deg, #0ea5e9 0%, #14b8a6 100%). Nuk përfshihet asnjë bibliotekë; vargu ndërtohet me logjikë shabllonesh të thjeshta JavaScript dhe bashkohet direkt nga grupi i ndalesave.
3. 3
   Parashikimi i drejtpërdrejtë vizatohet përmes stilit brendazi

   Vargu i gradientit i montuar zbatohet direkt te një element div si një stil sfondi brendazi, kështu që motori i vetë CSS-së i shfletuesit e vizaton parashikimin. Nuk ka canvas apo imazh të përfshirë — ajo që sheh është fjalë për fjalë vetia CSS që po zbatohet.
4. 4
   Dalje gati për kopjim në katër formate

   Një zgjedhës formatesh e transformon të njëjtin varg gradienti në CSS të thjeshtë (background: ...), një bllok CSS me rezervë ngjyre solide, një klasë vlere arbitrare Tailwind, ose një deklaratë variabli SCSS. Klikimi i Kopjo e shkruan daljen e zgjedhur te clipboard përmes navigator.clipboard.writeText. Gradienti aktual kodohet gjithashtu në hash-in e URL-së kështu që mund ta ruash si faqerojtës ose ta ndash.

Mjete të ngjashme