Remove Blinking Cursor From Input Field

How to remove blinking cursor from an input element

Here is a real quick fix for that annoying blinking cursor in an input field. This is a very bad practice for accessability, and should be thought about before use.

HTML

<input type="text" name="" class="input">

CSS

.input{
    color: transparent;
    text-shadow: 0 0 0 red;
}

.input:focus{
    outline: none;
}

To change the color of your input text edit the text-shadow color to your desired color.

about raymond ware

About Me

Hi, I am Full Stack Developer. I am passionate about JavaScript, and find myself working on a lot of React based projects.

Raymond Ware logo
©2020 Made from scratch by Raymond Ware