Search code examples
cssgoogle-chromefocusborder

How to reset / remove chrome's input highlighting / focus border?


I have seen that chrome puts a thicker border on :focus but it kind of looks off in my case where I've used border-radius also. Is there anyway to remove that?

image: chrome :focus border


Solution

  • You should be able to remove it using

    outline: none;
    

    but keep in mind this is potentially bad for usability: It will be hard to tell whether an element is focused, which can suck when you walk through all a form's elements using the Tab key - you should reflect somehow when an element is focused.