Text Foreground
<style>
* { box-sizing: border-box; }
.text{
background-clip:text;
-webkit-background-clip:text;
background-position: center;
color: transparent;
font-size:80px;
font-weight:bold;
text-align:center;
}
</style>
<h5 class="text">My Text</h5>
My Text
.text{
background-image:url('images/aaa2.jpg');
}
My Text
.text{
background-image:url('images/aaa2.jpg');
color:rgba(156, 0, 250, 0.3);
}
My Text
.text{
background-image: linear-gradient(#31ffaf,#00a5ff);
}
My Text
.text{
background-image: radial-gradient(#31ffaf,#00a5ff);
}
My Text
.text{
background-image: linear-gradient(#31ffaf 56%,#00a5ff 0%);
}
My Text
.text{
background-image: radial-gradient(circle,#31ffaf 40%,#00a5ff 0%);
}