This colorPicker is a light weight all-rounder (only ~46k incl. all 16 files) that can display and let you choose the entire color palette (~16.78 mil. colors) in 6 different color modes (+3 extra modes in RGB).
This highly customizable and easy to install app comes in 4 different sizes (from 151 x 87 pixels to 405 x 302 pixels) and therefore different feature levels so you can use it for every supposable cause from ‘easy choice’ to ‘professional determination’. That’s probably all you’ll ever need to let your clients choose the right color.
You’ll also find a lot of extra helpers and smart features like contrast-meter, color-difference-meter, value-slider in input fields, web-smart and web-save button, color memories and much more that can help your clients make the right decision. Read about the main features to see all the extras.
Main features:
* Easy installation and use (onclick=”colorPicker(this)”)
* Highly custumizable (input, output, scaling, modes,…)
* color pickers (cursors) are individually draggable
* app is draggable (toggle available to avoid)
* App is scaleable in 4 different sizes (see screenshot 1, 2, 3 and 4) (151 x 87 (HSB only), 155 x 155, 260 x 159 and full size 405 x 302 (pro mode)) (toggle available to avoid)
* scaling has a visual helper that adjust with contrast of chosen color (see screenshot ![]()
* Skin is transparent. Nice to all backgrounds and fully scaleable
(see screenshot 11, right bottom corner)
* 6 choose-able modes (H, S, B and R, G and B) with 3 extra ‘easyModes’ for RGB (for better understanding) (see screenshot 6, 7 and 10)
* 9 color memories
* no double saved colors (indicator available) in memory to preserve memory slots
* memory even keeps the last setup (color mode, RGB ‘easyMode’ and size of App)
* Contrast and color difference meter for color comparison with indicator for compliant choice.
* works in all browsers (IE since 5.5(?), FF, Safari, Crome, Opera, Konqueror, …)
* App is entirely skinn-able (even for non javaScripters). HTML and CSS are totally separate from javaScript (see screenshot 5, shows small GUI with HTML and CSS only)
* so, coders and designers can develop at the same time (without knowing or understanding what the other is doing…)
* all cursors adjust with the contrast individually (see screenshot 7 and 10)
* vertical slider has 2 separate cursors for better experience and understanding (see screenshot 7 and 10, cursors split while dragging)
* HSB, RGB and HEX values are editable and readable. CMYK is readable only.
* HSB and RGB values can be adjusted by dragging the input fields up and down, so x-axis and y-axis of main color-area is easyer to change withot loosing the value of the other axis. Also usefull to get more accurate values in smaller S-mode where dragging input fields is always decreasing / increasing values by 1, where as dragging cursors in S-mode is always 2 steps per pixel of draging.
* all colors are displayed as ‘true’ colors, even in RGB mode, so the color you navigate the cursor to will be displayed.
(in scaled modes you can choose only every second color though and in XXS-mode …)
* web-smart and web-safe colors as approximation/recalculation of picked color
* disappearing system cursor for better experience (not in Opera, Konqueror and black 1px dot in Chrome for Windows)
* very compact design (UI) that is still easy accessible
* hidden feature that lets you see color on existing web page background
* as less (nested) elements used as possible
* most program parts load only as needed at runtime with interaction
* all pictures are automatically preloaded for faster mode switching
* smart eventHandling
* smart handling and calculations at dragging time for better performance even with old browsers/computers
* no ‘id’s used (and therefore no single document.getElementById)
* CSS uses only one global class-selector
* no unwanted memory consumption (growth) at runtime
* no prototype, mootools, etc. (except some knowledge). All native code.
* javaScript, HTML, stylesheats and images are all together in all modes and sizes ~46k.
(for comparison…: the page you’re just at is >180k without the colorPicker?!!)









