<div>
  <label for="escritor">Escritor/a favorito/a</label>
  <input type="text" name="escritor" id="escritor" list="escritores">
</div>
<div>
  <label for="dia">Nº de día de la semana</label>
  <input type="text" name="dia" id="dia" list="dias" autocomplete="off">
</div>
<div>
  <label for="corbata">Color de la corbata</label>
  <input type="color" id="corbata" name="corbata" value="#999999" list="colores" />
</div>

<datalist id="escritores">
  <option>Stanisław Lem</option>
  <option>Ursula K. Le Guin</option>
  <option>Karel Čapek</option>
  <option>Philip K. Dick</option>
  <option>Lois McMaster Bujold</option>
  <option>Yasutaka Tsutsui</option>
</datalist>

<datalist id="dias">
  <option>1<!-- "1" es tanto label como value -->
  <option label="Martes">2<!-- "2" es el value -->
  <option value="3">Miércoles<!-- "Miércoles" es label -->
  <option label="Jueves" value="4">
  <option disabled>Juernes<!-- Este día no existe -->
  <option label="Viernes" value="5">Este texto se ignora
  <option value="6">Sábado
  <option value="7">Domingo
</datalist>

<datalist id="colores">
  <option>#ff0000
  <option>#00ff00
  <option>#0000ff
</datalist>

div {
  margin: 32px;
}

label {
  padding-right: 16px;
}

input[type=text] {
    padding: 4px;
    line-height: 1.5;
}