palette-js

WebJar for palette-js

License	ISC
Categories	JavaScript Languages
GroupId	org.webjars.npm
ArtifactId	palette-js
Last Version	1.0.3
Release Date	Mar 12, 2018
Type	jar
Description	palette-js WebJar for palette-js
Project URL	http://webjars.org
Source Code Management	https://github.com/jotavejv/palette-js

Download palette-js

Filename	Size
palette-js-1.0.3.pom
palette-js-1.0.3.jar	682 KB
palette-js-1.0.3-sources.jar	22 bytes
palette-js-1.0.3-javadoc.jar	22 bytes

How to add to project

Apache Maven

<!-- https://jarcasting.com/artifacts/org.webjars.npm/palette-js/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>palette-js</artifactId>
    <version>1.0.3</version>
</dependency>

Gradle Groovy

// https://jarcasting.com/artifacts/org.webjars.npm/palette-js/
implementation 'org.webjars.npm:palette-js:1.0.3'

Gradle Kotlin

// https://jarcasting.com/artifacts/org.webjars.npm/palette-js/
implementation ("org.webjars.npm:palette-js:1.0.3")

Apache Buildr

'org.webjars.npm:palette-js:jar:1.0.3'

Apache Ivy

<dependency org="org.webjars.npm" name="palette-js" rev="1.0.3">
  <artifact name="palette-js" type="jar" />
</dependency>

Groovy Grape

@Grapes(
@Grab(group='org.webjars.npm', module='palette-js', version='1.0.3')
)

Scala SBT

libraryDependencies += "org.webjars.npm" % "palette-js" % "1.0.3"

Leiningen

[org.webjars.npm/palette-js "1.0.3"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

Palette-js

Are you building a Design System or just a style guide? So, palettejs may help you!

Add a beautiful palette colors to your project with a single line of code.

This JS source code is a modern es2015, so keep it in mind for browser support.

How to install

npm install palette-js

OR

Just import the CDN source code

<script src="https://cdn.rawgit.com/jotavejv/palette-js/d482cf3/dist/palette.min.js"></script>

How does it work

The JS code will inject to your project the required CSS style for the list of colors that you will add to the plugin. Then it will create a list of colors inside of the parent selector that you need especify. The JS handle copy to clipboard for you too! Just click at any color and it will add that especific color to your clipboard :)

How to use

You need especify a array of colors and the especific parent selector that will wrap these colors.

const colors = [
"aquamarine",
"pink",
"darkturquoise",
"steelblue",
"cadetblue",
"lightblue",
"lightsalmon",
"teal",
"darkseagreen",
"khaki",
"lightcoral",
"lightgray",
"coral",
"slategray",
"gray",
"lightseagreen"
];

palette(colors, document.querySelector(".example"));

Codepen link Demo

Versions

Version
1.0.3 Mar 12, 2018