Wondering what’s next for npm?Check out our public roadmap! »


    0.5.0 • Public • Published

    JavaScript number-to-color

    npm npm GitHub issues

    An example of number to color conversion

    The small and fast library maps a range of numbers to a circular palette of colors. It varies hue (with saturation and lightness equals to 1) and returning RGB in different formats.

    import getColor from 'number-to-color'
    // getColor(number from 0 to max − 1, max)
    const tenthColorOfSixteen = getColor(10, 16) // equals {r: 0, g: 64, b: 255}


    You can see a live demo at https://bouvens.github.io/number-to-color/ The source code of this demo is available in the repository.

    Example of usage: Griffeath's machine.


    The default export in the package calculates all colors for numbers and memoizes these values for every max.

    Usage and formats

    Run in a console:

    npm i number-to-color

    Include and call it in wanted way:

    // with memoization
    import getColor from 'number-to-color'
    const tenthColorOfSixteen = getColor(10, 16) // equals {r: 0, g: 64, b: 255}
    // without memoization for numbers [0, 1)
    import mapColor from 'number-to-color/map'
    const tenthColorOfSixteen = mapColor(10 / 16) // equals {r: 0, g: 64, b: 255}
    // in hex format for numbers [0, 1)
    import hexColor from 'number-to-color/hexMap'
    const tenthColorOfSixteen = hexColor(10 / 16) // equals '#0040ff'

    hexColor(0) === hexColor(1), so don't use both edges in the same time. Thus values of getColor(0, 16) equals getcolor(16, 16).


    With all dependencies, minified and gzipped:

    • require('number-to-color') 159 B
    • require('number-to-color/map') 87 B
    • require('number-to-color/hexMap') 151 B

    How to run demo locally

    Run in a console:

    git clone git@github.com:bouvens/number-to-color.git
    cd number-to-color
    yarn run start

    Then open http://localhost:8080/

    For sure, you can use npm instead of yarn.


    • See another one example of use in Greffeath Machine cellular automata: demo, source code.
    • This library is inspired by Nano ID.


    npm i number-to-color

    DownloadsWeekly Downloads






    Unpacked Size

    20.9 kB

    Total Files


    Last publish


    • avatar