We often encounter the problem that the input has nothing in its properties, but when clicked or hovered, a blue frame appears.

Why does it happen?

Every browser has default css properties to display the active field. In addition, the browser uses the outline property.

What to do to remove this frame?

To remove the stroke from the input, you need to apply the property:

input {
    outline: none;
}

To remove the outline when focusing on the input, use these properties:

input:focus {
    outline: none;
}

If you want to draw a stroke from input as well as other elements such as select, a, button in all possible states, you can apply this property:

:active, :hover, :focus {
    outline: none;
    outline-offset: none;
}