View Code? Open in Web Editor
NEW
This is a simple gradient background generator that can be used to make simple gradient backgrounds for other projects. This was created for JS practice.
Home Page: https://epistemicpolymath.github.io/Gradient-Background-Generator-JS/
JavaScript 65.59%
CSS 18.52%
HTML 15.90%
gradient-background-generator-js's People
Contributors
Watchers
gradient-background-generator-js's Issues
The generator is generating identical colors for both color inputs causing the gradient to fail.
function setRandomColors ( ) {
// Created my own Hex Generator w/ the help of a friend
function getHexSegment ( ) {
// Each segment is 0-255 encoded in hex, or 00 - ff
// https://www.w3schools.com/js/js_random.asp
var hexValue = Math . floor ( Math . random ( ) * 256 ) . toString ( 16 ) ;
// Add the hexValue with a leading '0' to get "a" to "0a"
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
var newHex = hexValue . padStart ( 2 , '0' ) ;
console . log ( newHex ) ;
return newHex ;
}
// Generate Red Hex
var red = getHexSegment ( ) ;
// Generate Green Hex
var green = getHexSegment ( ) ;
// Generate Blue Hex
var blue = getHexSegment ( ) ;
// Set the Colors
color1 . value = "#" + red + green + blue ;
color2 . value = "#" + red + green + blue ;
setGradient ( ) ;
getHexSegment ( ) ;
}