Exercise: The Built-in `NgStyle` Directive

Let’s do some coding!

Objectives

For this task, let’s imagine a component with three range pickers using standard HTML input components. The pickers allow us to choose a value from 0 to 255. Each picker represents a single color value in the RGB system. So, the first picker selects a value for red, the second one for green, and the last one for blue.

These are the requirements for this task:

1. Next to each input, there’s an empty div element. Make the background color represent the selected color on that picker. So, if the selected value is 0, then the button should be black, and when it’s 255, it should be red. Any value in between should match that RGB value, for instance:

   1. Value = 100, results in rgb (100,0,0)
   2. Value = 200, results in rgb (200,0,0)

2. Underneath all inputs, there is an empty div. Please set its background to a color value based on all three properties.

Task

Please write the code below: