<html>
	<head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
        <script>
            (function(a){a["toRGB"]=function(a){var b=parseInt(a,16);return[b>>16,b>>8&255,b&255]};a["toHex"]=function(a,b,c){return(c|b<<8|a<<16|1<<24).toString(16).slice(1)}})(this);

            var color = $('#body').attr('data-color');
            var sigma = parseInt($('#body').attr('data-sigma'),10);

            var rgb = this.toRGB(color);

            var max = 0;
            var min = 255;
            for(var i in rgb)
            {
                if(rgb[i] >= max)
                {
                    max = rgb[i];
                }

                if(rgb[i] <= min)
                {
                    min = rgb[i];
                }
            }

            var ratio = [
                rgb[0]/max,
                rgb[1]/max,
                rgb[2]/max
            ];

            var maxColor = [
                Math.floor(255*ratio[0]),
                Math.floor(255*ratio[1]),
                Math.floor(255*ratio[2])
            ];

            var minColor = [
                Math.floor((255-min)*ratio[0]),
                Math.floor((255-min)*ratio[1]),
                Math.floor((255-min)*ratio[2])
            ];

            var minColor = [0,0,0];

            var maxIncrements = [
                (maxColor[0]-minColor[0])/(sigma),
                (maxColor[1]-minColor[1])/(sigma),
                (maxColor[2]-minColor[2])/(sigma)
            ]

            var minIncrements = [
                (255-maxColor[0])/(sigma),
                (255-maxColor[1])/(sigma),
                (255-maxColor[2])/(sigma)
            ]

            for(var i = 0; i < sigma; i++)
            {
                var newColor = [
                    Math.floor(minColor[0]+maxIncrements[0]*i),
                    Math.floor(minColor[1]+maxIncrements[1]*i),
                    Math.floor(minColor[2]+maxIncrements[2]*i)
                ];

                var hex = (i+1==sigma)?color:this.toHex(newColor[0], newColor[1], newColor[2]);
                console.log(hex);

                $('#body').append('<div style="width: 100px; height: 50px; background-color: #'+hex+'; border:1px solid #ccc"></div>');
            }

            for(var i = 1; i < sigma+1; i++)
            {
                var newColor = [
                    Math.min(255,Math.floor(maxColor[0]+minIncrements[0]*i)),
                    Math.min(255,Math.floor(maxColor[1]+minIncrements[1]*i)),
                    Math.min(255,Math.floor(maxColor[2]+minIncrements[2]*i))
                ];

                var hex = this.toHex(newColor[0], newColor[1], newColor[2]);

                console.log(hex);

                $('#body').append('<div style="width: 100px; height: 50px; background-color: #'+hex+'; border: 1px solid #ccc"></div>');
            }

        </script>
	</head>
    <body id="body" data-color="c0ffee" data-sigma="5"></body>
</html>