JSFiddle - React, Tailwind, and code Playground

by sardistic

HTML

<html>
    <head>
        <script>
        document.addEventListener("DOMContentLoaded", function() {

var matrix = document.createElement('div');
matrix.style.position = 'absolute';
matrix.style.top = '0px';
matrix.style.left = '0px';
matrix.style.width = '100%';
matrix.style.height = '100%';
matrix.style.backgroundColor = 'black';
matrix.style.color = 'green';
matrix.style.fontFamily = 'monospace';
matrix.style.fontSize = '122px';
matrix.style.overflow = 'hidden';
matrix.style.zIndex = '9999';
matrix.style.pointerEvents = 'none';
document.body.appendChild(matrix);

var c = 1;
var m = [];

window.setInterval(function() {
  var text = '';
  if (m.length < Math.random() * 100) m.push(1);
  for (var i = 0; i < m.length; i++) {
    if (m[i] * Math.random() > 0.9) m[i] = 0;
    text += String.fromCharCode(1e2 + Math.random() * 33);
    if (m[i]) text += String.fromCharCode(1e2 + Math.random() * 33);
  }
  matrix.innerHTML = text;
}, 33);
});
        </script>
    </head>
    <body style="margin: 0;">
        <div style="background-color: black; position: fixed; bottom: 0; width: 100%; height: 20px; padding: 20px; opacity: .85; z-index: 1000;">
            <svg id="Layer_1" data-name="Layer 1" height="40px" width="40px" style="top: -8px;
            position: relative;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 800"><defs><style>.cls-1{fill:#fff;}</style></defs><title>openai-symbol-flat-white</title><path class="cls-1"...