Return to Sky UI homepage

background

Applying the background system modifier to your component will allow consumers of your component to pass in the following props:

PropertyTypeDescription
$bgColorcolorsApplies a background color
$bgGradientgradientsApplies a background image gradient
$bgImagestringSets a background image URL or data source.
$bgPositionstringDefines the position of the background image.
$bgSizestringSpecifies how the background image is sized.
$bgAttachmentstringSets how the background image behaves when scrolling.
$bgRepeatstringDefines if and how the background image repeats.
$bgClipstringSpecifies how the background extends within the element.
$bgOriginstringDetermines the origin position of the background image.
$bgBlendModestringDefines how the background image blends with the element’s background color.