<h1>List with autocomplete</h1>
<form>
  <label for="pokemon">Choose your starter Pokemon:</label>
  <input list="starter-pokemon" id="pokemon" name="pokemon" placeholder="choose .." />
  <datalist id="starter-pokemon">
    <option value="Bulbasaur">
    <option value="Charmander">
    <option value="Squirtle">
    <option value="Caterpie">
    <option value="Weedle">
    <option value="Pidgey">
    <option value="Rattata">
    <option value="Spearow">
  </datalist>
</form>

body {
  align-items: center;
  background-color: CornflowerBlue;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

h1 {
  color: black;
  font-family: cursive;
  font-size: 3rem;
}

form {
  display: flex;
  flex-direction: column;
  max-width: 40vw;
}

form label {
  font-family: sans-serif;
  font-size: 1.2rem;
  margin-bottom: 12px;
}

form input {
  border: 2px solid DarkBlue;
  font-size: 1rem;
  height: 40px;
  padding: 5px;
}