image.png
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
p {
border: .8em darkviolet;
border-style: dotted double;
margin: 1em 0;
padding: 1.4em;
background: linear-gradient(60deg, red, yellow, red, yellow, red);
font: 900 1.2em sans-serif;
}
.text {
background-clip: text;
-webkit-background-clip: text;
color: rgba(0,0,0,.2);
}
</style>
</head>
<body>
<p class="text">The background is clipped to the foreground text.</p>
</body>
</html>
