Drag and Drop 1

<div class="max-w-md mx-auto">

  <!-- Drop-Zone Container -->
  <div class="bg-white p-6 rounded-md shadow-md">
    <label for="fileInput" class="relative cursor-pointer inline-flex items-center justify-center w-full h-40 border-2 border-dashed border-gray-300">
      <svg class="w-8 h-8 text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path></svg>
      <span class="ml-2 text-gray-500">Drag and drop files here or click to upload</span>
      <input id="fileInput" type="file" class="hidden">
    </label>
  </div>

</div>