Skip to content

Outline

Set outline color

Syntax

visual="outline:[color]"

Examples

html
<button visual="focus:outline:primary">Focus outline</button>

Preview

Outline

visual="outline:primary" - Outline does not affect layout

View Code
html
<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <button space="p:small" visual="outline:primary bg:white dark:bg:neutral-800 rounded:small">outline:primary</button>
</div>

Arbitrary Values

Supports custom values using bracket syntax:

html
<div visual="outline:[custom-value]">Custom</div>