Tell us what’s happening: I was supposed to set the background of my animation to the below percentages which i did all correctly but the challenge remain unsolved. can i get help please

Your code so far

div {
  height: 40px;
  width: 70%;
  background: black;
  margin: 50px auto;
  border-radius: 5px;
#rect {
  animation-name: rainbow;
  animation-duration: 4s;
   @keyframes rainbow {
      0% {
    background-colour: blue; 
      50% {
    background-colour: green;
      100% {
     background-colour: yellow;


<div id="rect"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/80.0.3987.106 Safari/537.36.

Challenge: Learn How the CSS @keyframes and animation Properties Work

Link to the challenge:

Welcome to the forum!

You are supposed to write background-color instead of background-colour…

Got it. Thanks :smile: