CSS Outline

outline draws a line around an element, similar to border — but with two key differences: it doesn't take up layout space (it can overlap neighboring content), and it isn't part of the box model, so it can't be targeted per-side the way border can with border-top etc.

.box {
  outline: 2px solid #f59e0b;
  outline-offset: 4px; /* gap between the border and the outline */
}

The most common real use is keyboard focus indicators:

button:focus-visible {
  outline: 2px solid #4f46e5;
  outline-offset: 2px;
}

Never set outline: none on an interactive element without providing some other visible focus style in its place — doing so makes the page unusable for anyone navigating by keyboard.