<div class="text-gradation">
<span>WEB DESIGN</span>
</div>
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700;900&display=swap');
.text-gradation{
display:inline-block;
background: #000;
padding: 50px;
font-family: 'Noto Sans JP', sans-serif;
font-weight: 900;
font-size: 60px;
}
.text-gradation span{
display: block;
background: linear-gradient(-45deg, #f44336, #03a9f4);
background-clip: text;
-webkit-background-clip: text;
color: rgba(0,0,0,0);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.