JSFiddle - React, Tailwind, and code Playground

by jnfsmile

HTML

<input placeholder="mandatory" />

SCSS

input {
   padding: 5px 72px;
   background: linear-gradient(to right, rgba(41, 184, 229, 1) 0%, rgba(188, 224, 238, 1) 28%, rgba(188, 224, 238, 1) 72%, rgba(41, 184, 229, 1) 100%);
	border: none;
	outline: none;
	&::-webkit-input-placeholder {
		color: red;
		font-weight: bold;
		padding: 0;
	}
	&:-ms-input-placeholder {
		color: red;
		font-weight: bold;
		padding: 0;
	}
}