Select Field - Placeholder

Community resources
1

Hi guys!

I just got started using Webflow. I wanted to create a nice Contact Form using one of the components “Select Field”. As I could see, there is no way to have a placeholder with 1 color and after I select something it would have a 2nd color. Right now is the first option displayed as a default. What if there is a group of people that doesn’t want to have a label above the field to explain what is actually happening?

Anybody know when it would be updated?

Thanks!

2

He @DannysVibe welcome to Webflow!

What you’ll want to do is make your first option of the select field your “Select a…” label. Then through JavaScript you can disable your first option.

Check out this post, describes it well: How to Disable First option in Form Dropdown (select menu)

3

Hey @Drew_Schafer,

Thank you for your reply! I disabled the first option, but I would like it to be as a placeholder with color (#333) and after selecting one of the options in the dropdown it would be in a different color (#111). Is there a way to manage that?

Is it possible to edit the css and the icon of the dropdown?

1 Like
4

I would also like to do what @DannysVibe is asking for

5

Here it is a tutorial: Webflow - Set the placeholder state for Select Field inputs

2 Likes
6

So in 2024 do we still not have a way to style the placeholder text for Select Fields unless using some extra javascript? Everywhere I look it is old posts using this same script but cant believe Select field’s placeholder still has no functionality to be styled.

7

Thank you for this!!