JSFiddle - React, Tailwind, and code Playground

HTML

<form>
  <input type="text" name="Term" class="saearch-input" placeholder="Search more than 3800 summaries"><!--
  --><button type="submit" class="">Search</button>
</form>

SCSS

html{
  background: green;
}
form {
  height: 40px;

  input {
    height: 30px;
    width: 75%;
    max-width: 400px;
    padding: 5px 10px;
    font-size: 16px;
    border: 0;
    background: gray;
  }

  button {
    background: #6699FF;
    height: 40px;
    width: 60px;
    background-image: url('https://i.imgur.com/Tp7TTNO.png');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-origin: content-box;
    padding: 7px;
    margin: 0;
    vertical-align: bottom;
    border: 0;
    color: transparent;
  }
}