Javascript - Generate Different Shades of the Same Color
<p>I would like to be able to call a function that takes a base color and returns an array of values that correspond to different shades of the same color. The array can contain either hex values or rgba() values. I would like to be able to input the amount of desired shades as well. The amount of shades would then also be able to be used as a metric to increment the shade. For example if I wanted the output have 3 different shades, the 1st shade would be 1/3 of the base.. however that math would work... Additionally, In some situations the 1st shade may need to be 100% transparent so I would like to accept an argument for the initial alpha. I've organized what I think would be the basic logic of the function but the math is unclear to me. </p>

<pre><code>        var buildColorStops = function (baseColor,numberOfValues,initialAlpha) {
            var b = baseColor;
            var n = numberOfValues //expected number of colors in the output. If n was 3 results would be [light blue, blue(base), dark blue] (# or rgba will work)
            var d = 1 / n; // if number of values was 5 d would represent 1/5 of the base. 
            var ia = initialAlpha; // some situations may require the first color to be 100% transparent 

            var outputArray = [];
            var i = 0;
            while (i &lt; n) {
                if (i == 0) {
                    //...math on base color &amp; incorporate initial alpha
                    outputArray.push("result of math on base")
                }
                else {
                    //...math on base color by incrementing d or 1/n
                    outputArray.push("result of math on base")
                }   
            }

            return outputArray;
        }// end of buildColorStops
</code></pre>