back

Back

Spiral

svg

June 29, 2024

Banner

How to implement:

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

Download image here: Download
Resolution: (5824 × 3264)
Extension: .png

Code:

/public/spiral.png

export default function Home() {
    return (
      <section
        style={{
          backgroundImage: `url(spiral.png)`,
          backgroundSize: 'cover', 
          backgroundPosition: 'center',
          backgroundRepeat: 'no-repeat' 
        }}
        className="flex min-h-screen flex-col items-center justify-between p-24"
      >
        
         {page / component}
      </section>
    );
  }

View background:

Captura de tela de 2024-06-29 02-01-33

Note

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

Any questions, criticisms or improvements, please suggest them through my Linkdin..