Easy way to make text gradient color css
Nikhil Chandra Roy

Nikhil Chandra Roy @nikhilroy2

About: Front-End Web Developer with JavaScript, ReactJs and Backend Python(Django)

Location:
Bangladesh
Joined:
Jan 16, 2020

Easy way to make text gradient color css

Publish Date: Apr 25 '21
3 0

I was browsing a website and got the point to make a text gradient color, it's just a simple post.

for HTML text

<h1> Hello World </h1>

Enter fullscreen mode Exit fullscreen mode

and CSS

h1{
  background: linear-gradient(red 30%, green, blue) center/cover no-repeat;
  color: white;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

Enter fullscreen mode Exit fullscreen mode

2 new css property is

-webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
Enter fullscreen mode Exit fullscreen mode

Thanks.

Comments 0 total

    Add comment