<form action="">

    <h4>Get Customized background images</h4>

    <div>Choose the color1 to be applied:

      <input type="color">

    </div>

    <div> percentile of area to be applied:

      <input type="slider"> </div>

    <div>

  </form>

<form>

    <h4>Get Customized background images</h4>

    <div>Choose the color1 to be applied:

      <input type="color">

    </div>

    <div> percentile of area to be applied:

      <input type="meter"> </div>

    <div>

  </form>

  <form>

    <h4>Get Customized background images</h4>

    <div>Choose the color1 to be applied:

      <input type="colour">

    </div>

    <div> percentile of area to be applied:

      <input type="range"> </div>

    <div>

  </form>

  <form>

    <h4>Get Customized background images</h4>

    <div>Choose the color1 to be applied:

      <input type="color">

    </div>

    <div> percentile of area to be applied:

      <input type="range"> </div>

    <div>

  </form>