Gradient
A flexible modern gradient js plugin.
Introduction
Installation
Yarn
yarn add @pluginjs/gradientNPM
npm i @pluginjs/gradientGetting Started
CDN:
Development:
<script src="https://unpkg.com/@pluginjs/gradient/dist/gradient.js"></script>Production:
<script src="https://unpkg.com/@pluginjs/gradient/dist/gradient.min.js"></script>Initialize
HTML:
<div class="element"></div>ECMAScript Module:
import Gradient from "@pluginjs/gradient"
Gradient.of(document.querySelector('.element'), options)CommonJS:
const Gradient = require("@pluginjs/gradient")
Gradient.of(document.querySelector('.element'), options)Browser:
<script src="https://unpkg.com/@pluginjs/gradient/dist/gradient.js"></script>
<script>
Pj.gradient('.element', options)
</script>API
Options
Options are called on gradient instances through the gradient options itself. You can also save the instances to variable for further use.
| Name | Description | Default |
|---|---|---|
"prefixes" |
Set prefixes | ["-webkit-","-moz-","-ms-","-o-"] |
"forceStandard" |
Set forceStandard | true |
"angleUseKeyword" |
Set angleUseKeyword | true |
"emptyString" |
Set emptyString | `` |
"degradationFormat" |
Set degradationFormat | false |
"cleanPosition" |
Set cleanPosition | true |
"color" |
Set color | {"format":false,"hexUseName":false,"reduceAlpha":true,"shortenHex":true,"zeroAlphaAsTransparent":false,"invalidValue":{"r":0,"g":0,"b":0,"a":1}} |
Browser support
Tested on all major browsers.
 IE / Edge |
 Firefox |
 Chrome |
 Safari |
 Opera |
|---|---|---|---|---|
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
License
@pluginjs/gradient is Licensed under the GPL-v3 license.
If you want to use @pluginjs/gradient project to develop commercial sites, themes, projects, and applications, the Commercial license is the appropriate license. With this option, your source code is kept proprietary.
For purchase an Commercial License, contact us purchase@thecreation.co.
Copyright
Copyright (C) 2022 Creation Studio Limited.