bg-repeat, bg-no-repeat and the x/y/round/space variants. This family contains 6 generated classes in Nakshora 3.0.
Classes#
| Class | Generated CSS |
|---|---|
bg-repeat | background-repeat: repeat; |
bg-no-repeat | background-repeat: no-repeat; |
bg-repeat-x | background-repeat: repeat-x; |
bg-repeat-y | background-repeat: repeat-y; |
bg-repeat-round | background-repeat: round; |
bg-repeat-space | background-repeat: space; |
Example#
example
<div class="bg-no-repeat">…</div>Responsive & variants#
Every class here accepts screen prefixes (sm: … xl:) and state variants — md:hover:p-4 style stacks compile to a single media query. See responsive/index|Responsive design and variants/index|Variants.
Best practices#
- Patterns: bg-repeat with tiny tiles; heroes: bg-no-repeat
Related#
utilities/backgrounds/gradients|Gradients · colors/index|Colors