Change an HTML input’s placeholder color with CSS

To change the color of an HTML input’s placeholder text using CSS, you can use the ::placeholder pseudo-element along with the color property. Here’s an example:

<input type="text" placeholder="Enter your name" class="my-input">

.my-input::placeholder {
  color: red; /* Set the desired color */
}

In the above example, the ::placeholder pseudo-element is used to target the placeholder text of the input field with the class “my-input”. The color property is then used to set the color of the placeholder text to red. You can replace “red” with any valid CSS color value, such as hexadecimal, RGB, or color names.

Note that not all browsers support customizing the placeholder color with CSS. However, most modern browsers do support it. It’s always a good practice to test your CSS styles across different browsers to ensure consistent behavior.