Text Color

Set text color

Syntax

visual="text:[color]"

Values

Value	CSS Output	Description
left	text-align: left	Align left
center	text-align: center	Align center
right	text-align: right	Align right
justify	text-align: justify	Justify text

Examples

<div visual="text:white">White text</div>
<div visual="text:center">Centered text</div>

Preview

Text Color

visual="text:primary" - Set text color from theme or palette

PrimarySecondarySuccessDanger

View Code

<div layout="flex" space="g:small p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <span visual="text:primary">Primary</span>
  <span visual="text:secondary">Secondary</span>
  <span visual="text:success">Success</span>
  <span visual="text:danger">Danger</span>
</div>

Arbitrary Values

Supports custom values using bracket syntax:

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