Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
HTML5 / Canvas

jQuery Gradient Creator

— Add-On to

Subscribe to our feed to stay up to date!

New! Follow us as you want it!

jQuery Gradient Creator - CodeCanyon Item for Sale


Ad: Bluehost hosting

jQuery Gradient Creator is a jQuery plugin that allows you to add gradient generators in your web apps and sites. Smart and fully cutomizable, it is suitable for any type of use : CSS generators, HTML5 canvas applications, live usages …


  • Unlimited gradient points
  • HTML5 Browsers compatible (IE9 +)
  • Generate and export CSS code
  • Customizable by CSS
  • Many smart parameters and methods
  • Fast loading and fluid usage
  • Included : colorpicker plugin and any jQuery-ui libraries
  • Can easily be combined with HTML5 canvas
  • No server file, only js and CSS
  • Documentation and examples


  • gradient : String or Array | Default gradient points
  • width : Int | Gradient preview width
  • height : Int | Gradient preview height
  • pointSize : Int | Int | Gradient points size
  • orientation : “horizontal” or “vertical” | Orientation of the generated gradient
  • target : jQuery selector | Define live targets. Ex: ”#target1,#target2”
  • tooltipGradient : String or Array | Tooltip background gradient points
  • onChange : Method | Executed on each gradient change and at start
  • onInit : Method | Executed on initialization only
  • noSupport : Method | Executed if the browser doesn’t support HTML5


  • getArrayGradient() : Return the gradient points array. Ex: [[“0%”,”#FFFFFF”],[“100%”,”#000000”]]
  • getCssGradient() : Return the full gradient generated CSS code
  • getStringGradient() : Return the gradient points as string. Ex: “0% #FFFFFF,100% #000000”
  • setOrientation(orientation) : “horizontal” or “vertical” | Change the generated gradient orientation in live.


If you need help, contact me from my envato profile

If you bought this plugin and love it, remember to leave a vote!

You need a freelance? Contact me!

Follow me


Wordpress Plugins

eeting Room

ATiSULQAT FIat Visual IIIITR Visitors Tracker

\\ FIat Assistant Creator,1.I.I.m.

PHP Plugins

PHP Flat Visual Chat PHP Flat Estimation and Payment Forms

jQuery Plugins

cts Super NoticE tnccn cC2zD JUgLZJ3 jQuery Gradient Creator

LJTIAI IVI Buttons crj QLrri hini jQuery Shining

jQuery Contact Form Simple Contact ajeieia Fowrr.flIV PX!rtYL4 CCD EjQjiery Live Menu Lsr, 4OE. Query bIWtlM1OI i.ive,vieflU MOA

Other components in this categoryAll components of this author
CommentsFrequently asked questions and answers


5 April 12

Last Update:

Compatible Browsers:
IE9, Firefox, Safari, Opera, Chrome

Files Included:
JavaScript JS, HTML, CSS

Software Version:


eCommerce, All Items, colorpicker, generator, gradient, gradient creator, gradient css3, gradient generator, html5 generator, jquery gradient