svg patternsvg fullpng fullcss gradientsvg blobsvg blend
background

Single svg as background

  1. Add svg in nextjs image component.
  2. In image component add negative z index to make it background
  3. In image component use object-cover, object-contain etc object property.
  4. Give image component widht and height to use object-cover
image component
<Image
        alt='background'
        src={bg2}
        className='absolute top-0 -z-10 h-full w-full object-cover'
      />