typo-cut-out.php


Quell Code


<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Typo cut-out</title>
<style>

body {font-family: Arial, Helvetica, sans-serif; margin:0;}

.container {
  height: 100vh;
  background: linear-gradient(135deg, rgb(0, 255, 149), rgb(180, 0, 255));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.text-dark, .text-light {
  font-size: 3em;
  padding: 0.5em 1em;
  font-weight: bold;
  margin: 1em;
}

.text-dark {
  background-color: black;
  color: white;
  mix-blend-mode: multiply;
}

.text-light {
  background-color: white;
  color: black;
  mix-blend-mode: screen;
}

</style>
</head>
<body>

<div class="container">
  <div class="text-light">kulturbanause_</div>
  <div class="text-dark">kulturbanause_</div>
</div>

</body>
</html>