I want to change caret color CSS in HTML like search textbox appear in youtube.com mobile version. I have attached a screenshot of YouTube search text field in mobile version web.
I want to change input color by CSS only without a usage of JavaSript or jQuery.
To change caret color CSS, need to apply CSS for textbox or textarea .
input,textarea {
color: #8f0407;
text-shadow: 0px 0px 0px #000 ;
-webkit-text-fill-color: transparent ;
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #ccc;
text-shadow: none;
-webkit-text-fill-color: initial;
}
Here is an example : https://codepen.io/bhaskars11/pen/apdJEd