Sometimes, we want to create a glowing border around an input field with CSS.
In this article, we’ll look at how to create a glowing border around an input field with CSS.
How to create a glowing border around an input field with CSS?
To create a glowing border around an input field with CSS, we set the box-shadow property.
For instance, we write
input {
border: 1px solid #4195fc;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: 0px 0px 4px #4195fc;
-moz-box-shadow: 0px 0px 4px #4195fc;
box-shadow: 0px 0px 4px #4195fc;
}
to set the box-shadow property to the shadow to add the glow effect.
We make the corners rounded by setting the border-radius.
Conclusion
To create a glowing border around an input field with CSS, we set the box-shadow property.
