color picker

Online Color Picker and Color Conversion Tool

Just a few hours ago I finished and deployed my new online service and very first endeavor in the interesting world of colors and color theory. Say hi to AcidJs.ColorConverter!

Features:

  • Native HTML5 color picker.
  • Color conversion to and from HEX, RGB, HSL, CMYK, HSV,  etc.
  • Color tints, tones and shades.
  • CMYK and RGB color charts, powered by Google Charts.
  • Inspirational color schemes.
  • Detailed information about the selected color.
  • Option to save the raw JSON data, containing the details of the selected color.
  • About 900 named color equivalents.

Built on top of HTML5 WebComponents (AcidJs.XTabs and AcidJs.XOverlay), and utilizing Object.observe() and the (not-so-new) input “color” type (sorry, no fallback for browsers, which do not support it and that’s on purpose!) and using the data from the brilliant ColorHexa service, which I transform to JSON via the REST API running on my server.

Screenshots:

The color picker:

cc-06

Raw data viewer:

cc-05

RGB and CMYK color charts

cc-04

Color conversions table

cc-03

Advanced view – shades, tints, tones and schemes

cc-02

Editor tab

cc-01

Check it on this page and have fun!

If you share the same interest towards HTML5 Web Components as I do these days, make sure you read my relevant blog posts and further endeavors on my HTML5, CSS3 and JavaScript Experiments and Insight website.

ColorPicker.JS 1.0

Say hello to ColorPicker.JS – the successor of one of my oldest scripts ColorPicker.XML that was discontinued a year ago due to poor browser support.

Supply your webforms or rich text online editor with this multifunctional, easy to set up, crossbrowser and cool looking color picker.

All you have to do is to create instances of the script (you may have unlimited number of pickers on your page). You may select among 12 preset skins*, several modes, 8 color presets and even create custom color palettes.

Setting up ColorPicker.JS and putting it to work is a matter of minutes.

Visit the webpage of ColorPicker.JS.

View online demo of ColorPicker.JS.

Download ColorPicker.JS.