The generator works by:
- harvesting user input from the HTML form,
- splitting the hexadecimal string given into their red, green, and blue components,
- parsing those hexadecimal numbers into decimal for ease of math,
- measuring the numerical difference between the start and end values for each red, blue, and green components,
- pushing new colour values onto the lists at a certain "resolution", or numerical step, until the final desired value is reached,
- adjusting each of the colour lists to be the same length as the longest one (i.e. if there is a large difference in the given red values, but not in blue, there would be less in-between values for blue, and it needs to have average values injected to bring it up to the same length in order to allow the next step),
- putting the red, green, and blue components back together into hexadecimal colour strings, and finally,
- printing the result to the HTML page, displaying the gradient as a stack of 1-pixel height div elements with a background colour for each in-between hex code.
A live version of the app can be used at www.nymphofthevales.com/content/gradient/
Complete.