index.html

<section class="files">
  <div class="upload">
    <input type="file" class="upload__input" id="files" name="files[]" multiple />
    <label class="upload__label" for="files">
      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
        <path
          fill="currentColor"
          d="M296 384h-80c-13.3 0-24-10.7-24-24V192h-87.7c-17.8 0-26.7-21.5-14.1-34.1L242.3 5.7c7.5-7.5 19.8-7.5 27.3 0l152.2 152.2c12.6 12.6 3.7 34.1-14.1 34.1H320v168c0 13.3-10.7 24-24 24zm216-8v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h136v8c0 30.9 25.1 56 56 56h80c30.9 0 56-25.1 56-56v-8h136c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z"
        ></path>
      </svg>
      <span>Upload file</span>
    </label>
  </div>

  <article class="file">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 24 24"
      stroke-width="1.25"
      width="24"
      height="24"
    >
      <polyline points="9.14 15.82 6.27 12.96 9.14 10.09"></polyline>
      <polyline points="14.86 15.82 17.73 12.96 14.86 10.09"></polyline>
      <line x1="12.95" y1="10.09" x2="11.05" y2="15.82"></line>
      <polygon
        points="20.59 6.27 20.59 22.5 3.41 22.5 3.41 1.5 15.82 1.5 20.59 6.27"
      ></polygon>
      <polygon
        points="20.59 6.27 20.59 7.23 14.86 7.23 14.86 1.5 15.82 1.5 20.59 6.27"
      ></polygon>
    </svg>

    <header class="file__header">
      <h2 class="file__title">No File</h2>
      <div class="file__data">
        <span class="file__count">0 files</span>
        <span>●</span>
        <span class="file__size">0 MB</span>
      </div>
    </header>
  </article>
</section>