-
-
Notifications
You must be signed in to change notification settings - Fork 4.8k
-
I'm creating a new issue for this problem that was already reported and closed but I still reproduce it in the latest version.
text-color is not applied in Chrome unless you use !important, works as expected in Firefox and Safari.
A small repo with a basic case https://github.com/franpeza/placeholder-styling-issues
What version of Tailwind CSS are you using?
4.1.14
What build tool (or framework if it abstracts the build tool) are you using?
@tailwindcss/postcss: 4.1.14
next: 15.5.4
What version of Node.js are you using?
v24.0.2
What browser are you using?
Chrome
What operating system are you using?
macOS
Reproduction URL
https://github.com/franpeza/placeholder-styling-issues
Describe your issue
Colors are not applied to placeholder in Chrome unless you use !important
Beta Was this translation helpful? Give feedback.
All reactions
Replies: 1 comment 5 replies
-
I cannot reproduce this in Arc, Chrome, or Chrome Canary.
It appears to work in Play and your reproduction.
Can you provide screenshots of what you're seeing?
Beta Was this translation helpful? Give feedback.
All reactions
-
Also, could you test in Chrome Canary? I have a feeling it's related to settings you have set (likely unintentionally) in Chrome itself.
Beta Was this translation helpful? Give feedback.
All reactions
-
I've tested in all Chrome flavors I have installed (stable, beta and canary) with the same result:
Screenshot 2025年10月08日 at 12 43 15
I didn't tested in other chromium browsers but I've done it now and in Brave and Opera it works as expected 🤔
Screenshot 2025年10月08日 at 12 44 57
In the case of Chrome beta and canary I don't have any extension installed, the only difference between all chrome versions and Brave and Opera is that the formers are managed by my organization 🤔
I've created a new branch v3 with the same example using tailwind v3 and the output is the expected one
Beta Was this translation helpful? Give feedback.
All reactions
-
That is super weird. I assume this has something to do with CSS variables and maybe a browser bug caused by some other overriding settings.
Are you able to access chrome://version to verify what version you are on? (Just the version number — I wouldn't post a whole dump of that here b/c I don't know if there's identifying information on that screen).
Beta Was this translation helpful? Give feedback.
All reactions
-
Sure:
- stable: 141.0.7390.66 (Official Build) (arm64)
- beta: 142.0.7444.3 (Official Build) beta (arm64)
- canary: 143.0.7459.0 (Official Build) canary (arm64)
Beta Was this translation helpful? Give feedback.
All reactions
-
After some digging it turns out that I have some extensions added by policy and one of them is injecting a global style that overrides the placeholder color for all elements. I will file an issue on that extension to have these global styles removed, not nice on their part :(
Not sure if we could apply a workaround for this or or other cases we may have with different extensions that don't play nice and inject global styles :(
Beta Was this translation helpful? Give feedback.