Results Summary Component

Hi, I reviewed your code, and I found the issue. It's actually so simple, just a typo.

In the custom property --color--circle-gradient-violet: hsla(256, 72%, 46, 1); you missed a % at the third value, that caused anywhere you use that property won't work. It should be --color--circle-gradient-violet: hsla(256, 72%, 46%, 1); and that's it.

A suggestion I can give you is that you can assign custom properties to another, you have --color--circle-gradient-violet: hsl(256, 72%, 46%, 1); --color--circle-gradient-persian-blue: hsl(241, 72%, 46%, 0); --color-circle-gradient: linear-gradient(hsl(256, 72%, 46, 1), hsl(241, 72%, 46%, 0));

which is repeating the values, it should be like this --color--circle-gradient-violet: hsla(256, 72%, 46%, 1); --color--circle-gradient-persian-blue: hsla(241, 72%, 46%, 0);--color-circle-gradient: linear-gradient(var(--color--circle-gradient-violet), var(--color--circle-gradient-persian-blue));

btw, sorry for my English if i make a mistake.

Hi Kate!

Great attempt!

I think the reason the gradient doesn't work is because you are using hsl and are providing it 4 arguments - I think you meant to use hsla() - the a stands for alpha channel I believe, and it influences the opacity, I haven tested your code though, so maybe I'm wrong :)

Keep up the work! :)

to me was better using a web like https://cssgradient.io/! i know we need to learn how it works the gradient but sometimes its dificult!