kpbaldur / color-randomjs

Color-RandomJS - Practica para Javascript

Hola y bienvenido!

Presento esta practica de iniciacion realizada con JS puro, el proyecto consiste en un generador aleatorio de colores en su formato Hexadecimal y RGB.

Ahora comenzemos:

Como primer paso creamos el generador de colores aleatorios en Hexadecimal, ya que lo encontre un poco mas sencillo que el RGB.

Creamos un contenedor padre para luego dejar centrado nuestro contenido, y le agregamos una clase y id con el nombre "hex", ahora viene lo complicado.(recordar crear la funcion Onclick para el button, si no al realizar las pruebas con el consol.log no nos arrojara nada, ya me paso a mi xD)

Creamos una funcion con al cual nos otorne los simbolos hexadecimales iniciando desde el 0 hasta f, que serian los caracteres que se utilizan en el codigo de colores hexadecimales y una que nos entrege el simbolo "#" para colocarlo desde su inicio.

Ahora creamos "for" para que nos entregue de forma aleatoria los digitos de la funcion "simbolos" declarada con anterioridad con un largo maximo de 6 digitos, para luego concatenar con la funcion "#" para asi obtener el color hexadecimal.

Acontinuacion viene lo mas complicado que encontre, pasar de Hexadeimal a RGB, usamos el mismo parametro Hexadecimal que obtuvimos, y creamos 3 constantes la cual agregara unos cuantos bits de diferencia por cada tipo de color

Y finalmente, agregamos la funcion color al background del cuerpo, de esta forma cadavez que usemos el boton para generar un color aleatorio, el estilo del body de nuestra pagina tomara el color correspindiente a la funcion "color". Asi como a su vez, al texto de nuestra etiqueta SPAN con la ID "hex" tomara el nombre hexadecimal del color que se elavoro sucediendo lo mismo con el codigo RGB para la etiqueta SPAN con el ID "rgb"

Agregamos un par de estilos, y una media query para un diseño responsivo para dispositivos moviles y tendriamos lista nuestra pagina para generar colores aleatorios en Hexadecimal y RGB con Javascript