Streaming live at 10am (PST)

Need help on changing the text field color inside a form


Please help me with something. I’m trying to change the color of my textfield in webflow, is there code I can embed or a way I can do so in webflow? I have attached some screenshots of my problem please see attached.

Thanks in advance.

Hi there,

Placeholder text is styled by the browser.

The code of an input is approximately that:

<form id="first-form">
<input id="email-form" placeholder="Enter your name" maxlength="256">

You can reach the placeholder text and style it using a pseudo-class :placeholder. So like this:


In order to constraint the changes to the specific element, you can set it like this:

form#email-form input:placeholder

So final code can be something like this:

form#email-form input:placeholder { color:red; font-weight:700; }

And you put that in the section of the custom code tab of your sites’ settings. (or at page level) (Of course you change email-form to the ID you gave to the form, or only use form input:placeholder to impact all forms on the site.)

1 Like

Hi @vincent

Thanks a lot for your help. I found a way to change the colour, not for the whole site but for selected pages.

I placed a component >embed then I added this code inside

.w-input::-webkit-input-placeholder { /* WebKit browsers */
    color:    #ffffff;
.w-input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #ffffff;
    opacity: 1;
.w-input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #ffffff;
    opacity: 1;
.w-input:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #ffffff;

Appreciate your help!


Thanks @starlord, this saved my day. Hero!