Outline and Box-Shadow
Add focus outlines and shadow effects around elements using outline and box-shadow.
outline Property
outline draws a line outside the border. It does not affect layout — elements around it do not shift. The shorthand format mirrors border: width style color.
:focus {
outline: 3px solid royalblue;
}outline-offset
outline-offset moves the outline away from the border edge. Positive values push it outward; negative values move it inward (clipping effect).
:focus-visible {
outline: 2px solid #4a90e2;
outline-offset: 4px;
}