Buttons | SmookyDev red robin 87

<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<button
  class="bg-[#ADD8E6] px-6 py-3 text-white relative overflow-hidden z-30 group hover:bg-sky-800 transition-all duration-500 rounded tracking-wider font-semibold"
>
  Hover Me

  <svg
    class="absolute inset-0 left-0 top-0 fill-sky-300 -z-30 opacity-0 group-hover:opacity-100 group-hover:duration-300 group-hover:transition-all group-active:fill-sky-950"
    preserveAspectRatio="xMidYMid meet"
    viewBox="0 0 204.000000 113.000000"
    xmlns="http://www.w3.org/2000/svg"
    version="1.0"
  >
    <g
      stroke="none"
      transform="translate(0.000000,113.000000) scale(0.100000,-0.100000)"
    >
      <path
        d="M850 1069 c-23 -48 -27 -66 -19 -85 5 -14 9 -40 9 -57 0 -18 4 -38 9
            -46 9 -14 19 36 19 99 1 44 7 71 17 78 9 6 35 56 35 67 0 3 -9 5 -20 5 -15 0 -28 -16 -50 -61z"
      ></path>
      <path
        d="M1662 1099 c-24 -17 -40 -34 -38 -37 3 -3 14 2 24 11 10 10 22 17 25 17 4 0 16 9 27 20 30 30 9 24 -38 -11z"
      ></path>
      <path