DEV Community

Discussion on: 100 underline/overlay animations | The ultimate CSS collection 🥇

Collapse
 
madsstoumann profile image
Mads Stoumann

Amazing collection! I used the "Basic 3" on a recent project, but had a CSS validation error, that boiled down to linear-gradient(currentColor 0 0).
Is that a short way of writing linear-gradient(to bottom, currentColor 0 0, currentColor 100% 0)?
And, as to bottom is default, that can be omitted I guess?

Collapse
 
afif profile image
Temani Afif

It's the short way of writing linear-gradient(currentColor,currentColor). The direction and the color stops aren't important since a gradient between two same colors will always give that color. I am defining two colors stop for it (0 and 0) to write the color only once inside the gradient.
The syntax I am using is a bit uncommon but it's valid. The CSS validator is never up to date anyway.
I wrote a recent article about this if you want: css-tricks.com/cool-hover-effects-...

Collapse
 
madsstoumann profile image
Mads Stoumann

Cool, didn’t know that syntax!