How to change placeholder color in textarea?
You can change it with ::placeholder
in your CSS styles.
textarea::placeholder {
color: red;
}
Since some older browser may not interpret this reference correctly, in most cases I’d recommend using this instead:
You should also set the color of ::-webkit-input-placeholder
, :-moz-placeholder
, ::-moz-placeholder
, and :-ms-input-placeholder
.
<style>
textarea::-webkit-input-placeholder {
color: #ff0000;
}
textarea:-moz-placeholder {
color: #ff0000;
}
textarea::-moz-placeholder {
color: #ff0000;
}
textarea:-ms-input-placeholder {
color: #ff0000;
}
textarea::placeholder {
color: #ff0000;
}
</style>
Example:
<style>
textarea::-webkit-input-placeholder {
color: #ff0000;
}
textarea:-moz-placeholder {
color: #ff0000;
}
textarea::-moz-placeholder {
color: #ff0000;
}
textarea:-ms-input-placeholder {
color: #ff0000;
}
textarea::placeholder {
color: #ff0000;
}
</style>
<textarea placeholder="Textarea with red placeholder"></textarea>
Output: