Sections

Outline

Utilities for controlling an element’s outline.

Class Properties
.outline-none outline: 0;

Usage

Use .outline-none to remove browser specific outlining of focused elements.

When using this utility you should apply your own focus style to ensure that focusable elements are accessible.

Variants

By default, no responsive or hover-state variants are generated for outline utilities.

Responsive

To include responsive variants like .md:outline-none, add "outline" to the $responsive-variants variable in your theme’s _variables.scss file when recompiling your CSS:

$responsive-variants: (
  // ...
  "outline",
);

Hover-state

To include hover-state variants like .hover:outline-none, add "outline" to the $hover-variants variable:

$hover-variants: (
  // ...
  "outline",
);