How to implement:

With tailwind installed in your project (tutorial), implement these tailwind classes in your parent div where it will reflect the background.

<div className="relative min-h-screen flex-col items-center px-4 sm:px-6 lg:px-8 flex flex-col justify-center sm:items-center mx-auto">
  <div className="absolute top-0 start-1/2 w-full h-full bg-no-repeat bg-top bg-cover z-0 transform -translate-x-1/2 bg-[url('https://preline.co/assets/svg/examples-dark/squared-bg-element.svg')]"></div>
  {your page / component}
</div>

View background:

Mobile and Desktop:

Note

If this background has served you in any way, consider following me on github or supporting me to continue working at BacksEasy.