npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

dot-color

v1.1.0

Published

Modern JavaScript color conversion. That uses setters and getters under the hood to make life simple.

Downloads

4

Readme

build passing License maintained Vulnerabilities Node Version

Dot color JS

Demo

This is a modernized version of simple-color it uses modern JavaScript getters and setters and all sorts of JavaScript goodness to make one of the lightest but most feature dense color convertors for JavaScript you can find on NPM.

Usage

Use link for full documentation.


const dotColor = require("dot-color")
const color = new dotColor()

color.cmyk = "cmyk 0 50 60 60"
console.log(color.ral) // {lrv: 5, name: "Red Brown", ral: 8012}

color.rgb = "rgb 10 60 240"
color.rgb = {r: "10", g: "60", b: "240" }
console.log(color.ral) // {lrv: 4, name: "Ultramarine Blue", ral: 5002}

console.log(color.hex3) // "03F"
console.log(color.hex8) // 0A3CF0FF"
console.log(color.rgb) // {b: "240", g: "60", r: "10"}
console.log(color.cmyk) // {c: 96, k: 6, m: 75, y: 0}

Features

1 | Identify color values from string 2 | Convert to any color format 3 | Generate color patterns 4 | Use logical javascript design pattern for custom color objects

Supported colors

The main thing we do better than any other color convertor is the ability to get any string and figure out if there is a color buried in there. We designed this package to be used behind an input field where the values can range from "RED" to "CMYK 30 20 10 5" and even "C 30 K 5 M 20 Y 10". The rule is: if you can read it as a color, we identify it as a valid color.

Accepted colors input test

| color system | object | array | string (basic format) | | --- | --- | --- | --- | | cmyk | {c: 39, m: 0, y: 39, k: 7} | [39, 0, 39.7] | 'cmyk 39 0 39 7' | grayscale | | | '78' | | hex3 | | | '#9E9' | | hex4 | | | '#9E9F' | | hex6 | | | '#90EE90' | | hex8 | | | '#90EE90FF' | | html | | | 'Light Green' | | hsl | { h: 120, s: 73.4, l: 74.9 } | [120, 73.4, 74.9] | 'hsl 120 73.4 74.9' | | hsv | { h: 120, s: 39.4, l: 93.3 } | [120, 39.4, 93.3] | 'hsl 120 39.4 93.3' | | lab | {l: 86.5, a: -46.3, b: 36.9} | [86.5, -46.3, 36.9] | 'lab 86.5 -46.3 36.9' | | pantone | {name: '358C'} | | 'pantone 358C' | | ral | { ral : 6019 } | | 'ral 6019'| | rgb | { r: 144, g: 238, b: 144 } | [144, 238, 144] | 'rgb 144 238 144'| | rgba | { r: 144, g: 238, b: 144, a: 1 } | [144, 238, 144, 1] | 'rgba 144 238 144 1'| | rgb decimal | | | 'rgb decimal 6812065' | | w | { r: 144, g: 238, b: 144, a: 1 } | [144, 238, 144, 1] | 'w 544' | | xyz | { x: 44, y: 69, z: 45 } | [44, 69, 45] | 'xyz 44 69 45' | | yuv | { y: 180, u: 113.2, v: 73.5 } | [ 180, 113.2, 73.5 ] | 'yuv 180 113.2 73.5' |

Contribute

If there are any features you would like to support, or want to add it directly please send us a pull request. I`m more than happy. If you have any suggestions or you spotted an aberrant behavior or bugs, don't hesitate to send me an email.

There is only one rule, no breaking changes

License

Copyright © 2020, Radu Dragan. Licensed under the MIT License.

Thank you

I`m Radu, Thank you for using my color convertor, I hope it is useful for you. I'm genuinely excited to build this kind of solutions.