Wednesday, May 12, 2010

Color Vision with Javascript

The Color Vision library for Javascript is composed of two parts; a color vision daltonize.js [1, 2] and simulate.js [3, 4, 5].  These algorithms combined enable developers to target specific forms of color blindness from both sides of the spectrum.

The following code is an example of using the Color Vision library to daltonize an image, exposing details to a protanope:

Color.Vision.Daltonize(image, {
        type: "Protanope,
        callback: function(canvas) {

Here are the results on an Ishihara test plate [6].

Color Blindness Simulation 

Gary W. Meyer and Donald P. Greenberg [3] present an algorithm to simulate the world through the eyes of dichromats.  In this example, we simulate how a protanopic (red-cone missing) individual would perceive and image:

Color.Vision.Simulate(image, {
        type: "Protanope",
        amount: 1.0,
        callback: function(canvas) {

One interesting thing about this algorithm is that it can be modified to match other forms of color blindness by modulating the confusion line coordinates.  At this time, there is no online color vision tests that can provide measurements of an individuals confusion line, as such, one is left to creating fanciful psychedelic customalies:

Color.Vision.Simulate(image, {
        type: "Custom",
        x: 0.7465,
        y: 0.2535,
        m: 1.273463,
        yint: -0.073894,
        amount: 1.0,
        callback: function(canvas) {

You can find the entire project online.


  1. Françoise Viénot, Hans Brettel and John D. Mollon
    Digital video colourmaps for checking the legibility of displays by dichromats
    Color Research and Application, 24(4): 243-252
    , 1999.

  2. Onur Fidaner, Poliang Lin and Nevran Ozguven.
    Analysis of Color Blindness

  3. Gary W. Meyer and Donald P. Greenberg
    Color-Defective Vision and Computer Graphics Displays
    IEEE Computer Graphics and Applications, 8(5): 28-40, 1988.

  4. Vivianne C. Smith and Joel Pokorny
    Spectral sensitivity of the foveal cone photopigments between 400 and 500 nm
    Vision Research, 15(2): 161-171, 1975.
  5. Bruce Lindbloom
    RGB Working Space Information

  6. Les Daltoniens
    Le test d’Ishihara


  1. Hello Michael

    Nice work. Under which licence did you publish daltonize.js?


  2. The links to the javascript files seems to be broken.

    1. Many years later, but to use this there needs to be an additional quote after the final e and before the comma on the line:
      type: "Protanope",

      Also "image" should be the image object. I just used document.getElementById("myImageID")

  3. Hi Michael,

    First of all thanks for your awesome work....Secondly, I want to highlight those pixels in the image (may be replace the colors of those pixels into black spots), which represents the most confused colors of the whole image. These confused colors can be of many different intensities.

    I am trying to understand the algorithm i.e. Daltonize and Simulate, but I am unable to figure out, "How can I say, during the scan of image pixel by pixel, whether to highlight this pixel or not on the basis of most confused color information".

    Please give me some guidance about it. I will be thankful to you.

  4. nike outlet store,
    true religion outlet,
    stuart weitzman boots,
    louis vuitton outlet,
    polo ralph lauren,
    cheap snapbacks,
    the north face clearance,
    true religion jeans,
    jordan shoes,
    cheap michael kors handbags,
    true religion jeans,
    rolex watches,
    ralph lauren outlet,
    nike free uk,
    michael kors factory outlet,
    oakley sunglasses,
    gucci handbags,
    true religion jeans,
    air jordan 11,
    dansko outlet,
    louis vuitton bags,
    cheap mlb jerseys,
    ed hardy clothing,
    michael kors outlet,
    tiffany jewellery,
    michael kors handbags,
    christian louboutin,

  5. I appreciate the so-date information on your part.
    foro de opciones binarias

  6. This blog is so nice to me. I will continue to come here again and again. Visit my link as well. Good luck
    obat aborsi
    cara menggugurkan kandungan

  7. Truly very important information that can provide a bright spot for reference sources

    vimax asli kayu stigi gold scott Home Design Ideas Plans

  8. I like the post format as you create user engagement in the complete article. It seems round up of all published posts. Thanks for gauging the informative posts. cara menggugurkan kandungan

  9. Greetings admin
    I like your topic, after reading your article very helpful at all and can be a source of reference
    I will wait for your next article updates
    Thank you, for sharing


    penirum asli

    Titan Gel


    Hammer Of Thor

  10. Michael Kors Handbags On Sale,
    You can find Michael Kors handbags in many department stores around the country.
    Michael Kors Purses Outlet,
    They are being seen all over the place.
    Michael Kors Bags On Sale,
    There are so many fabulous handbags to fall in love with.
    MK Handbags,
    To find these amazing handbags you can also shop online for all your Michael Kors products.

  11. This article is interesting and useful. Thank you for sharing. And let me share an article about health that God willing will be very useful. Thank you :)

    Khasiat Daun Sirsak untuk Benjolan
    Obat Telinga Bernanah paling Ampuh
    Cara Menghilangkan Benjolan di Miss V