Текст картинкой

background-clip

by Ankhena

HTML

<div class="text">
  TEXT
</div>

CSS

.text {
  border: 1px solid black;
  display: inline-block;
  padding: 0.2em;
  font-family: Arial;
  font-size: 100px;
  font-weight: bold;
  background: linear-gradient(lightblue, violet) center / cover;
    -webkit-background-clip: text;
  background-clip: text;

  color: transparent;
}