intro.svg

  <svg fill="none" viewBox="0 0 500 80" width="500" height="80" xmlns="http://www.w3.org/2000/svg">
  <foreignObject width="100%" height="100%">
    <div xmlns="http://www.w3.org/1999/xhtml">
      <style>
        .neon {
        animation: neonAnim 2s alternate-reverse infinite;
        color: #E467F9;
        font-family: Consolas;
        font-size: 26px;
        text-align:center;
        margin:auto;
        display:flex;
        justify-content:center;
        align-items:center;
    }
    @keyframes neonAnim {
    from {
        text-shadow:
          0 0 15px rgba(228, 103, 249, .7),
          0 0 45px rgba(228, 103, 249, .7),
          0 0 105px rgba(228, 103, 249, .7);
      }
      to {
        text-shadow:
          0 0 10px rgba(228, 103, 249, .7),
          0 0 25px rgba(228, 103, 249, .7),
          0 0 65px rgba(228, 103, 249, .7);
      }
}
      </style>

      <div class="neon">
        A passionate Web3 developer from Pakistan
      </div>
    </div>
  </foreignObject>
</svg>