INTRODUCTION
IntroductionCore ConceptsGETTING STARTED
InstallationQuick startWhirl Compiler SettingsCORE CONCEPTS
Using Utility ClassesStyle FunctionsPseudo-Classes and statesResponsive DesignResponsive Base ElementThemeArbitrary ValuesLAYOUT
aspect-ratiodisplayoverflowpositionvisibilityobject-fittop / right / bottom / leftFLEXBOX
flex-basisflex-directionflex-wrapflexflex-growflex-shrinkgapjustify-contentalign-contentalign-itemsalign-selfSPACING
paddingmarginSIZING
widthmin-widthmax-widthheightmin-heightmax-heightTYPOGRAPHY
font-sizefont-styleauto-sizetext-outlineletter-spacingtext-aligncolorword-spacingparagraph-spacingtext-overflowoverflow-positionwhite-spaceBACKGROUND
background-colorbackground-imagebackground-positionbackground-repeatbackground-sizeBORDER
border-radiusborder-widthborder-colorEFFECTS
text-shadowopacityFILTER
Filterblurbrightnesscontrastgrayscalehue-rotateinvertsaturatesepiaTRANSITION
transition-propertytransition-durationtransition-timing-functiondelayTRANSFORM
rotatescaletransform-origintranslatebackground-position
| Class | Styles |
|---|---|
| bg-top-left | background-position: top left; |
| bg-top | background-position: top; |
| bg-top-right | background-position: top right; |
| bg-left | background-position: left; |
| bg-center | background-position: center; |
| bg-right | background-position: right; |
| bg-bottom-left | background-position: bottom left; |
| bg-bottom | background-position: bottom; |
| bg-bottom-right | background-position: bottom right; |
| bg-position-(<custom-property>) | background-position: var(<custom-property>); |
| bg-position-[<value>] | background-position: <value>; |