Animation to Change the Hover State of a Button

Applied Visual Design: Use CSS Animation to Change the Hover State of a Button

Hopefully this lesson is fixed so I can learn and receive 100% on the challenges.

Smokey this is not 'Nam, this is coding. There are rules

what issue are you facing?

please provide your code and the challenge link

button {
border-radius: 5px;
color: white;
background-color: #0F5897;
padding: 5px 10px 8px 10px;

button:hover {
animation-name: background-color;
animation-duration: 500ms;
@keyframes background-color {
background-color: #f791d0;


Each time I run my test the following below keeps appearing. This has happened before which is why I posted about what is a ‘stub’. There’s been times the following day I’ll wake up and realize I was running low on brain power from sleep deprivation…however with this one in particular I took time to get some rest…retried and I’m still stumped.

// running tests There should be one rule under


that changes the




at 100%. // tests completed

Hi @heikja. Your keyframes should look like:

@keyframes background-color {
100% { }

Insert the background-color property between the curly braces after 100% and the value of background-color is #4791d0 but you have #f791d0 in your code.

Well I wish I would have noticed that sooner, thank you!