Is it possible to get current color value of an input placeholder text? Usually I'd use getComputedStyle to get current element style values, but it does not return the placeholder value.

Any workarounds for this apart from parsing the css text and getting the value using regex?

Thanks.

Is it possible to get current color value of an input placeholder text? Usually I'd use getComputedStyle to get current element style values, but it does not return the placeholder value.

Any workarounds for this apart from parsing the css text and getting the value using regex?

Thanks.

• javascript
• css

3 Answers 3

the second parameter of getComputedStyle is pseudoElt selector

so to get placeholder color of your input element:

var styles = window.getComputedStyle(inputEl, ':placeholder');
console.log(styles.getPropertyValue('color'));

It's

window.getComputedStyle(inputEl, '::placeholder').getPropertyValue("color");
// note the DOUBLE colon here ----^^

Works in both Chrome and Firefox

Usually placeholder we have to use a class name and then change the placeholder color

input.text-filed::-webkit-input-placeholder {
   color: red;
}

So u know the class which is have the color