Background Repeat

Set background repeat behavior

Syntax

visual="bg-repeat:[value]"

Values

Value	CSS Output	Description
repeat	background-repeat: repeat	Repeat both axes
no-repeat	background-repeat: no-repeat	No repeat
repeat-x	background-repeat: repeat-x	Repeat horizontally
repeat-y	background-repeat: repeat-y	Repeat vertically
round	background-repeat: round	Round repeat
space	background-repeat: space	Spaced repeat

Examples

<div visual="bg-repeat:no-repeat">Single background</div>

Preview

Background Repeat

visual="bg-repeat:no-repeat" - Control background tiling

repeat

no-repeat

repeat-x

View Code

<div layout="flex" space="g:medium p:medium" visual="bg:neutral-100 dark:bg:neutral-900 rounded:medium">
  <div space="p:small" visual="bg:primary text:white rounded:small">repeat</div>
  <div space="p:small" visual="bg:primary text:white rounded:small">no-repeat</div>
  <div space="p:small" visual="bg:primary text:white rounded:small">repeat-x</div>
</div>