JSFiddle - React, Tailwind, and code Playground

HTML

<div class="msg" name="msg" placeholder="Write message..." contenteditable="true"></div>

CSS

div.msg {
    font-size: 16px;
    float: left;
    width: calc(100% - 80px);
    height: 64px;
    line-height: 64px;
    padding: 0 10px;
    color: #1a1a1a;
    border: 0;
    background-color: transparent;
    outline: none;
    font-weight: 400;
    border: 1px solid #000;
    margin-top: 25px;
  }
  [contenteditable=true]:empty:before{
  content: attr(placeholder);
  display: block; /* For Firefox */
}
[contenteditable=true]:empty:focus:before {
    content: "";
}