SCSS proste nakładanie gradientów

Krzysztof Furtak Code Snippets 2 Comments

Bądźmy szczerzy … nakładanie gradientów w CSS’ie nie jest proste i przyjemne. Nie dość, że trzeba pamiętać o prefiksach, to jeszcze poszczególne prefiksy mają różną konstrukcję. Jeśli używasz w projekcie SASS’ów, możesz w znacznym stopniu ułatwić sobie prace!

CSS text gradient

Krzysztof Furtak Code Snippets 1 Comment

Moim zdaniem jednym z ładniejszych efektów tekstowych jakie możemy osiągnąć za pomocą HTMLa i CSSa jest gradient na tekście. Wykorzystujemy do tego: background-image jako linear-gradient, background-clip: text;, text-fill-color: transparent; oraz w pewnych przypadkach line-height. Rozpatrzymy dwa przypadki. W pierwszym pokolorujemy linie tekstu na różne kolory, a w drugim nałożymy na tekst gradient.