Colorify is a collection of color tools that comes in three forms: a website, a command line tool, and a node.js library:
The website is built on react, and contains a few toy apps that can manipulate and display colors.
- Colorify: Page: Home
- Colorify: Page: About
- Colorify: App: Stats
- Colorify: App: Mixer
- Colorify: App: Math
The cli can be installed by running npm install -g colorify. This will
add colorify to your PATH. For the command line options, you can run
colorify --help:
> colorify --help
Usage: colorify [options] [command]
Commands:
help print help information (alias for using -h or --help)
random [options] get a random color
stats [options] [color] get color stats about an input string
Options:
-h, --help output usage information
-v, --version output the version number> colorify random --help
Usage: random [options]
get a random color
Options:
-h, --help output usage information
-f, --format <format> css format types: hex, rgb, percent, hsl, hwb> colorify stats --help
Usage: stats [options] [color]
get color stats about an input string
Options:
-h, --help output usage information
-p, --path <path> only show the specified path (i.e. schemes.tetradic.2)$ colorify random
#E13954$ colorify random
#A8A3E5$ colorify random -f rgb
rgba(137, 102, 186, 0.64)$ colorify stats --path "hex" "orange"
#ffa500$ colorify stats --path "websafe" "orange"
#ff9900$ colorify stats red
"lib": {
"onecolor": {
"red": 1,
"green": 0,
"blue": 0,
"alpha": 1,
"hue": 0,
"saturation": 1,
"value": 1,
"lightness": 0.5,
"cyan": 0,
"magenta": 1,
"yellow": 1,
"black": 0,
"x": 0.4124564,
"y": 0.2126729,
"z": 0.0193339,
"l": 1,
"a": 1,
"b": 0,
"hex": "#ff0000",
"hexa": "#ffff0000",
"css": "rgb(255,0,0)",
"cssa": "rgba(255,0,0,1)",
"cmyk": [
"CMYK",
0,
1,
1,
0,
1
],
"hsl": [
"HSL",
0,
1,
0.5,
1
],
"hsv": [
"HSV",
0,
1,
1,
1
],
"lab": [
"LAB",
1,
1,
1,
1
],
"rgb": [
"RGB",
1,
0,
0,
1
],
"xyz": [
"XYZ",
0.4124564,
0.2126729,
0.0193339,
1
]
},
"color": {
"rgb": {
"r": 255,
"g": 0,
"b": 0
},
"hsl": {
"h": 0,
"s": 100,
"l": 50
},
"hsv": {
"h": 0,
"s": 100,
"v": 100
},
"cmyk": {
"c": 0,
"m": 100,
"y": 100,
"k": 0
},
"rgbArray": [
255,
0,
0
],
"hslArray": [
0,
100,
50
],
"hsvArray": [
0,
100,
100
],
"cmykArray": [
0,
100,
100,
0
],
"rgbaArray": [
255,
0,
0,
1
],
"hslaArray": [
0,
100,
50,
1
],
"alpha": 1,
"red": 255,
"green": 0,
"blue": 0,
"hue": 0,
"saturation": 100,
"lightness": 50,
"saturationv": 100,
"value": 100,
"cyan": 0,
"magenta": 100,
"yellow": 100,
"black": 0,
"hexString": "#FF0000",
"rgbString": "rgb(255, 0, 0)",
"rgbaString": "rgba(255, 0, 0, 1)",
"percentString": "rgb(100%, 0%, 0%)",
"hslString": "hsl(0, 100%, 50%)",
"hslaString": "hsla(0, 100%, 50%, 1)",
"keyword": "red",
"luminosity": 0.2126,
"dark": true,
"light": false
}
},
"alpha": 1,
"cmyk": {
"c": 0,
"m": 100,
"y": 100,
"k": 0
},
"hsl": {
"h": 0,
"s": 100,
"l": 50
},
"hsv": {
"h": 0,
"s": 100,
"v": 100
},
"rgb": {
"r": 255,
"g": 0,
"b": 0
},
"rgbPercent": {
"r": 100,
"g": 0,
"b": 0
},
"hex": "#ff0000",
"hexTriplet": "ff0000",
"isRandom": false,
"parseSuccessful": true,
"closest": {
"name": "Red",
"rgb": [
255,
0,
0
]
},
"websafe": "#ff0000",
"websmart": "#ff0000",
"isWebsafe": true,
"isWebsmart": true,
"schemes": {
"complementary": [
"#ff0000",
"#00ffff"
],
"splitComplementary": [
"#ff0000",
"#00ff80",
"#ff00aa"
],
"splitComplementaryCW": [
"#ff0000",
"#00ff80",
"#ff00ff"
],
"splitComplementaryCCW": [
"#ff0000",
"#ffff00",
"#0080ff"
],
"triadic": [
"#ff0000",
"#00ff00",
"#0000ff"
],
"clash": [
"#ff0000",
"#80ff00",
"#8000ff"
],
"tetradic": [
"#ff0000",
"#80ff00",
"#00ffff",
"#8000ff"
],
"fourToneCW": [
"#ff0000",
"#ffff00",
"#00ffff",
"#0000ff"
],
"fourToneCCW": [
"#ff0000",
"#00ff00",
"#00ffff",
"#ff00ff"
],
"fiveToneA": [
"#ff0000",
"#15ff00",
"#00ff95",
"#0095ff",
"#1500ff"
],
"fiveToneB": [
"#ff0000",
"#ffaa00",
"#80ff00",
"#00ff2a",
"#1500ff"
],
"fiveToneC": [
"#ff0000",
"#ffd500",
"#80ff00",
"#0095ff",
"#ff00aa"
],
"fiveToneD": [
"#ff0000",
"#ffaa00",
"#00ff95",
"#8000ff",
"#ff00d4"
],
"fiveToneE": [
"#ff0000",
"#15ff00",
"#002aff",
"#8000ff",
"#ff00aa"
],
"sixToneCW": [
"#ff0000",
"#ff8000",
"#00ff00",
"#00ff80",
"#0000ff",
"#8000ff"
],
"sixToneCCW": [
"#ff0000",
"#80ff00",
"#00ff00",
"#0080ff",
"#0000ff",
"#ff0080"
],
"neutral": [
"#ff0000",
"#ff4000",
"#ff8000",
"#ffbf00",
"#ffff00",
"#bfff00"
],
"analogous": [
"#ff0000",
"#ff8000",
"#ffff00",
"#80ff00",
"#00ff00",
"#00ff80"
]
},
"shades": [
"#ff0000",
"#e60000",
"#cc0000",
"#b30000",
"#990000",
"#800000",
"#660000",
"#4d0000",
"#330000",
"#1a0000"
],
"tints": [
"#ff0000",
"#ff1a1a",
"#ff3333",
"#ff4d4d",
"#ff6666",
"#ff8080",
"#ff9999",
"#ffb3b3",
"#ffcccc",
"#ffe5e5"
],
"tones": [
"#ff0000",
"#f20d0d",
"#e51a1a",
"#d92626",
"#cc3333",
"#bf4040",
"#b24d4d",
"#a65959",
"#996666",
"#8c7373"
],
"blind": {
"protanomaly": "#b75013",
"protanopia": "#8f7e1e",
"deuteranomaly": "#c34c00",
"deuteranopia": "#a17800",
"tritanomaly": "#fe0f00",
"tritanopia": "#fd1700",
"achromatomaly": "#7f2323",
"achromatopsia": "#363636"
}
}In it's current state, this is a pretty lame node.js library. All it does is expose access to some other helpful color libraries and includes a few helper functions that were needed for the colorify website. The libraries that are included are:
- color
- color-blind
- color-harmony
- color-quantize
- color-scheme
- color-stats
- colorconverter
- colorname
- onecolor
You can install the library by running npm install colorify and use it:
var colorify = require('colorify');
console.log(Object.keys(colorify.lib)); // outputs:
// [
// 'color',
// 'colorBlind',
// 'colorHarmony',
// 'colorQuantize',
// 'colorScheme',
// 'colorStats',
// 'colorConverter',
// 'colorName',
// 'onecolor'
// ]- chromatist
- chroma.js
- ...more to add? submit a pull request
git clone https://github.com/skratchdot/colorify.git
cd colorifynpm installgulpNow browse to the app at http://localhost:8080/colorify
- Color Theory on Wikipedia
- Color Theory on HandPrint.com
- Adobe Kuler
- Color Sphere
- Color Hexa
- Colrd.com
- Paletton.com
- RYB Color Wheel
- ColorBlendy
- ColourCo.de
- Color @ hailpixel.com
- hslpicker
- ColorBlender
- ColorSchemer
- Coolors
- Please.js
- Lovely Palettes
- Color-Hex
- Color Share
- UI Gradients
- Random CSS Gradient Generator
- draGGradients
- bada55.io
- 4096 Color Wheel
- AllProfitAllFree - Color Wheel
- Color Wheel & Color Scheme Generator
- ColoRotate
- Colors On The Web
- Colour Lovers
- Colr
- Instant Color Schemes
- Color Code Hex
- Colordrop
- Color Contrast Links
- Colorable
- Computer Color Is Broken
- CSS Colours
- HTML Color Codes
- Color Matters
- I Want HUE
- Data Color Picker
- CSS Gradient
- Color: From Hexcodes to Eyeballs
- ColorBox
- CodePen.io: Experimental Gradient Editor
- PALX - Automatic UI Color Palette Generator
- Grabient
- GradientsGuru
- Eggradients
- Web Gradients
- Image Color Picker
- Color Zebra
- Accessible Color Generator
Have a link to share? Submit a pull request to add to this list.
Copyright (c) 2014 skratchdot
Licensed under the MIT license.