Color Picker

Easy
55
63.4% Acceptance

In this lab, you'll build a simple color picker application using HTML and JavaScript. The user should be able to select a color using the input element and see the selected color displayed on the screen in the form of div element. In addition to that, a paragraph element inside the div should display the color code of the chosen color.

Instructions

  1. Create an input element of type color with id colorPicker.
  2. Create a div element with id colorDisplay to show the selected color
  3. Create a p element inside the div#colorDisplay with id colorCode to show the color code.
  4. Add an event listener to #colorPicker to listen for input chage. You can use input event
  5. When input event is triggered, capture the color from the #colorPicker
  6. Set the captured color as the background color of #colorDisplay
  7. Show the color Hex Code in the #colorCode element