Well, before the start you must use this on tailwindcss version 3. In version 3 it gives you bunch of option to customize your own. Here it's a light turn on & off animation with tailwindcss. So let's check the code.

HTML

<!-- this div for center everything -->
<div class="grid place-items-center h-screen">
  <div id="box" class="relative w-[500px] h-[500px]">
    <span class="
      absolute inset-0  rotate-0
      before:content-[''] before:absolute  before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:0"></span>

    <span class="
      absolute inset-0  rotate-45
      before:content-[''] before:absolute  before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:1"></span>

    <span class="
      absolute inset-0  rotate-90
      before:content-[''] before:absolute  before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:2"></span>

    <span class="
      absolute inset-0  rotate-[135deg]
      before:content-[''] before:absolute before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:3"></span>

    <span class="
      absolute inset-0  rotate-[180deg]
      before:content-[''] before:absolute before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:4"></span>

    <span class="
      absolute inset-0  rotate-[225deg]
      before:content-[''] before:absolute before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:5"></span>

    <span class="
      absolute inset-0  rotate-[270deg]
      before:content-[''] before:absolute before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:6"></span>

    <span class="
      absolute inset-0 rotate-[315deg]
      before:content-[''] before:absolute before:left-1/2 before:w-[250px] before:h-[300px]
      before:bg-[url('https://i.ibb.co/fFxztL5/lightbulb-1.png')] before:bg-no-repeat
      before:bg-cover before:bg-center before:-translate-x-1/2 before:-translate-y-[100px] before:scale-75
      on-off
    " style="--i:7"></span>
  </div>
</div>

CSS

you must config the custom CSS style in tailwindcss life. You can see .on-off is a custom class

@tailwind base;
@tailwind components;
@tailwind utilities;

.on-off::before {
  animation: animate 2s steps(1) infinite;
  animation-delay: calc(0.1s * var(--i));
}

@keyframes animate {
  0%, 100% {
    background: url('https://i.ibb.co/fFxztL5/lightbulb-1.png');
    background-size: cover;
    background-position: center;
    
  }
  50% {
    background: url('https://i.ibb.co/mC6qSbf/lightbulb.png');
    background-size: cover;
    background-position: center;
  }
}

📝 here the image i upload it will be gone after 6month so you can put your own custom image or image link. The image size 128x128

You can also check the code Tailwind Play 🧑‍💻