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

rainbowcolor

v1.1.1

Published

textarea selection library for the browser

Downloads

2

Readme

RainbowColor

RainbowColor helps you manipulate and convert colors using a simple and chainable library. To install it you can simply run bower install RainbowColor or fetch it here from lib/rainbow.min.js and copy it to your own codebase. A file that contains standalone functions is available at src/standalone_functions.js that could be useful if you want to implement color algorithms in your own program. It is also possible to use RainbowColor with node - just run npm install RainbowColor and you are ready to go.

Usage

Getting started with initializing a new RainbowColor object. RainbowColor currently supports hex, rgb and hsl colors.

new RainbowColor('#FFF', 'hex');
new RainbowColor([255, 255, 255], 'rgb');
new RainbowColor([0, 0, 100], 'hsl');

You can translate the color to other color representations using RainbowColor.get and providing a supported color.

new RainbowColor([0, 0, 0], 'rgb').get('hex'); // #000000

Using your new RainbowColor object you can now blend colors, darken and lighten if you want to do so.

new RainbowColor('#FFFFFF', 'hex').blend(new RainbowColor('#000000', 'hex'), 0.5).get('hex'); // #808080
new RainbowColor('#FFFFFF', 'hex').darken(0.5).get('hex'); // #808080
new RainbowColor('#000000', 'hex').lighten(0.5).get('hex') // #808080

Extending RainbowColor

You can add your own color modules to RainbowColor pretty easily by adding an object to RainbowColor.colors which stores all handlers. All handlers must contain one method named fromRgb that takes an rgb color and translates to your color module, and one method named toRgb which takes your color and translates it to rgb.

// Handles hex colors of the form #FFFFFF.
Rainbow.colors.hex = {
  fromRgb: function(rgb) {
    return '#' + ((1 << 24) + (rgb[0] << 16) + (rgb[1] << 8) + rgb[2]).toString(16).slice(1);
  },

  toRgb: function(hex) {
    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
    return [
      parseInt(result[1], 16),
      parseInt(result[2], 16),
      parseInt(result[3], 16)
    ];
  }
};

Tests

I have recently added a couple tests, and found a ton of bugs while doing so, but they are still lacking. I will continue work on intensive testing. Tests are done using QUnit and can be viewed in the tests directory.