JSFiddle - React, Tailwind, and code Playground

HTML

Type anything:
<input type="text" class="myTextBox">

CSS

body {
  background-color: Chartreuse;
}

.myTextBox {
  border-top-style: hidden;
  border-right-style: hidden;
  border-left-style: hidden;
  border-bottom-style: groove;
  background-color: chartreuse;
 }
  /* I made the background-color same as the page's background-color because this leaves just a line to type on. */
  .myTextBox:focus {
    /* This is the CSS code that runs when 'myTextBox' is focused */
    outline: none;
  }