Contact Form 7 placeholder change style or color :
For changing the color (Added black for this site but you can change black #000 to any color code you want just replace the color code in CSS) for the contact form 7 placeholder you can add the bellow custom css code to your theme additional CSS box or to Appearance>Customize>Additional CSS box.
::-webkit-input-placeholder { /* WebKit browsers */
color: #000 !important;
opacity: 1;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #000 !important;
opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #000 !important;
opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #000 !important;
opacity: 1;
}
If you add this CSS in your custom CSS box, this will applied globally all the contact form you are using in your site/domain and will change the contact form 7 placeholder color. But if you want it will act with all contact form but Footer then you need to be specific.
Now you are thinking that how to change specific placeholder color? You do not need to think much just follow the bellow procedure. First you need to get the form id see the bellow image.
You can add the bellow CSS code with the color code you want to change into the Appearance>Customize>Additional CSS (Just replace the id #wpcf7-f2528-o2 with your contact form id).
#wpcf7-f2528-o2 ::placeholder {
color: #fff !important;
}
You Might Also Like: Useful tools for your site