Difference between hex colour, RGB, & RGBA and when should each they be used?

There's no differences between a RGB and hex color.

hex to decimal :

FF = 255

=> #FFFFFF = rgb(255,255,255)

When you break down the hexa color :

#FF  FF    FF
red green blue

But with rgba (alpha) you can add a alpha variable it add an opacity to your color.

You can use RGB and HEX it depends of your preferences

Examples :

div {
 width:100px;
 height:100px;
 border:solid 1px black;
 display:inline-block;
}

.rgb{
  background-color:rgb(124,220,50); /* to hexa = 7C, DC, 32 */
}

.hexa{
  background-color:#7CDC32;
}

.rgba{
  background-color:rgba(124,220,50,0.2); /* opacity = 20% */
}

<div class="rgb">rgb</div>
<div class="hexa">hexa</div>
<div class="rgba">rgba</div>

The Difference between RGB and RGBA is simple to say, "there is no difference" EXCEPT the "A" -> Alpha

RGB (Red Green Blue) RGBA (Red Green Blue Alpha)

You use the alpha parameter when you want the color to get transparent. (Values between 0.0 - 1.0)

And the main difference between RGB / RGBA and HEX is that HEX uses a mix of 6 characters and numbers. (Hexadecimal) And RGB uses 3 sets of 3 numbers, which have a range of 0-255.

There's no more difference and it's up to you what you want to use.