Outline

Utilities for controlling an element's outline.

@include('_partials.class-table', [ 'rows' => [ [ '.outline-none', 'outline: 0;', "Remove an element's outline.", ], ] ])

Usage

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

It is highly recommended to apply your own focus styling for accessibility when using this utility.

@component('_partials.code-sample', ['class' => 'text-center bg-gray-200'])

@slot('code')@endslot @endcomponent

Customizing

@include('_partials.variants-and-disabling', [ 'utility' => [ 'name' => 'outline', 'property' => 'outline', ], 'variants' => ['focus'], ])

Tailwind UI is now in early access!