Preparing search index...
The search index is not available
Windi API
Windi API
windijs
useVariant
Function useVariant
use
Variant
(
rule
:
string
, utilities
:
Utilities
[]
)
:
StyleObject
[]
Parameters
rule:
string
utilities:
Utilities
[]
Returns
StyleObject
[]
Settings
Member Visibility
Inherited
Theme
OS
Light
Dark
Modules
Windi API
@windijs/colors -
v1.0.4
@windijs/config -
v1.0.10
@windijs/core -
v1.1.11
internal
@windijs/helpers -
v1.1.9
internal
@windijs/plugin-
utils -
v1.1.7
internal
@windijs/shared -
v1.0.8
internal
@windijs/style -
v1.1.11
internal
@windijs/transformer -
v1.0.3
@windijs/utilities -
v1.0.17
internal
@windijs/variants -
v1.0.17
internal
windijs -
v1.1.11
internal
Color
Utility
Base
Theme
Basic
Shape
Functions
Box
Entry
CSSAt
Rules
CSSClasses
CSSDecls
CSSElements
CSSFunctions
Color
Entry
Color
Functions
Config
Geometry
Box
Entry
HTMLAttrs
HTMLTags
Image
Functions
Line
Style
Entry
Position
Entry
Repeat
Style
Entry
String
Entry
Style
Object
Base
Transition
Timing
Functions
URLEntry
Wide
Entry
Alpha
Entry
Angle
Entry
Base
Colors
Bootstrap
Colors
Bootstrap
Theme
Colors
Build
Func
Bulma
Colors
Bulma
Theme
Colors
CSSAlpha
Value
CSSAngle
CSSAngle
Percentage
CSSAngle
Type
CSSAngular
Color
Stop
Or
Hint
CSSAt
Rule
CSSAttribute
Type
CSSBlock
Body
CSSBorder
Radius
CSSBorder
Radius
Item
CSSColor
Hint
CSSColors
CSSDecl
CSSDimension
CSSDimension
Object
CSSDimension
Type
CSSFill
Rule
CSSFlex
CSSFlex
Type
CSSFrequency
CSSFrequency
Percentage
CSSFrequency
Type
CSSInteger
CSSLength
CSSLength
Percentage
CSSLength
Type
CSSLinear
Color
Stop
Or
Hint
CSSMap
CSSObject
CSSPercentage
CSSPercentage
Type
CSSPosition
CSSPrefixer
CSSProps
CSSResolution
CSSResolution
Type
CSSRule
CSSRules
CSSSelector
CSSSide
Or
Corner
CSSStyle
Sheet
CSSTime
CSSTime
Percentage
CSSTime
Type
Camel
Case
Color
Properties
Color
Style
Object
Color
Style
Proxy
Dark
Mode
Config
Element
Selectors
GeneralCSSData
GeneralHTMLAttrs
HSL
HSLA
HWB
Handler
Html5
Tags
Integer
Entry
Length
Entry
Line
Width
Entry
Material
Colors
Meta
Type
Nested
Proxy
Number
Dict
Percent
Entry
Pick
Value
RGB
RGBA
Safe
Entry
Set
Up
Style
Entry
Style
Loader
Style
Namer
Style
Object
Style
Properties
Style
Proxy
Style
Proxy
Handler
Tailwind
Colors
Target
Creator
Theme
Theme
Type
Time
Entry
Unknown
Dict
Utilities
Utilities
Config
Utility
Meta
Variant
Builder
Variants
Config
Web
Colors
Windi
Colors
$in
Q
SymbolCSS
Symbol
Data
Symbol
Meta
Symbol
Proxy
align
Content
Config
align
Items
Config
align
Self
Config
animation
Config
animation
Delay
Config
animation
Duration
Config
animation
Iteration
Count
animation
Timing
Function
aspect
Ratio
Config
back
In
Down
Keyframes
back
In
Left
Keyframes
back
In
Right
Keyframes
back
In
Up
Keyframes
back
Out
Down
Keyframes
back
Out
Left
Keyframes
back
Out
Right
Keyframes
back
Out
Up
Keyframes
background
Attachment
Config
background
Clip
Config
background
Image
Config
background
Origin
Config
background
Position
Config
background
Repeat
Config
background
Size
Config
base
Colors
blend
Mode
Config
blur
Config
bootstrap
Blue
bootstrap
Colors
bootstrap
Cyan
bootstrap
Dark
bootstrap
Gray
bootstrap
Green
bootstrap
Indigo
bootstrap
Light
bootstrap
Orange
bootstrap
Pink
bootstrap
Purple
bootstrap
Red
bootstrap
Shade500
Colors
bootstrap
Teal
bootstrap
Theme
Base
Colors
bootstrap
Theme
Colors
bootstrap
Yellow
border
Radius
Config
border
Style
Config
border
Width
Config
bounce
In
Down
Keyframes
bounce
In
Keyframes
bounce
In
Left
Keyframes
bounce
In
Right
Keyframes
bounce
In
Up
Keyframes
bounce
Keyframes
bounce
Out
Down
Keyframes
bounce
Out
Keyframes
bounce
Out
Left
Keyframes
bounce
Out
Right
Keyframes
bounce
Out
Up
Keyframes
box
Decoration
Break
Config
box
Shadow
Config
brightness
Config
bubble
Keyframes
bulma
Black
bulma
Blue
bulma
Colors
bulma
Cyan
bulma
Dark
bulma
Green
bulma
Grey
bulma
Light
bulma
Orange
bulma
Purple
bulma
Red
bulma
Theme
Colors
bulma
Turquoise
bulma
White
bulma
Yellow
ch
cm
color
contrast
Config
deg
degree
Config
dpcm
dpi
dppx
drop
Shadow
Config
em
ex
fade
In
Bottom
Left
Keyframes
fade
In
Bottom
Right
Keyframes
fade
In
Down
Big
Keyframes
fade
In
Down
Keyframes
fade
In
Keyframes
fade
In
Left
Big
Keyframes
fade
In
Left
Keyframes
fade
In
Right
Big
Keyframes
fade
In
Right
Keyframes
fade
In
Top
Left
Keyframes
fade
In
Top
Right
Keyframes
fade
In
Up
Big
Keyframes
fade
In
Up
Keyframes
fade
Out
Bottom
Left
Keyframes
fade
Out
Bottom
Right
Keyframes
fade
Out
Down
Big
Keyframes
fade
Out
Down
Keyframes
fade
Out
Keyframes
fade
Out
Left
Big
Keyframes
fade
Out
Left
Keyframes
fade
Out
Right
Big
Keyframes
fade
Out
Right
Keyframes
fade
Out
Top
Left
Keyframes
fade
Out
Top
Right
Keyframes
fade
Out
Up
Big
Keyframes
fade
Out
Up
Keyframes
filters
flash
Keyframes
flex
Direction
Config
flex
Grow
Config
flex
Shrink
Config
flex
Stretch
Config
flex
Wrap
Config
flip
InXKeyframes
flip
InYKeyframes
flip
Keyframes
flip
OutXKeyframes
flip
OutYKeyframes
font
Family
Config
font
Size
Config
font
Style
Config
font
Variant
Numeric
Config
font
Weight
Config
fr
fraction
Config
grad
gradient
Config
gradient
Direction
Config
grayscale
Config
grid
Auto
Columns
Config
grid
Auto
Flow
Config
grid
Auto
Rows
Config
grid
Column
Config
grid
Column
End
Config
grid
Column
Start
Config
grid
Row
Config
grid
Row
End
Config
grid
Row
Start
Config
grid
Template
Columns
Config
grid
Template
Rows
Config
head
Shake
Keyframes
heart
Beat
Keyframes
height
Config
hinge
Keyframes
hue
Rotate
Config
hyphens
Config
iOSAccessible
Colors
iOSAccessible
Dark
Colors
iOSAccessible
Light
Colors
iOSColors
iOSDark
Colors
iOSLight
Colors
image
Rendering
Config
inherit
initial
inset
Config
invert
Config
jack
In
The
Box
Keyframes
jello
Keyframes
justify
Content
Config
justify
Items
Config
justify
Self
Config
letter
Spacing
Config
light
Speed
In
Left
Keyframes
light
Speed
In
Right
Keyframes
light
Speed
Out
Left
Keyframes
light
Speed
Out
Right
Keyframes
line
Height
Config
list
Style
Position
Config
list
Style
Type
Config
macOSAccessible
Colors
macOSAccessible
Dark
Colors
macOSAccessible
Light
Colors
macOSAccessible
Vibrant
Colors
macOSAccessible
Vibrant
Dark
Colors
macOSAccessible
Vibrant
Light
Colors
macOSColors
macOSDark
Colors
macOSLight
Colors
macOSVibrant
Colors
macOSVibrant
Dark
Colors
macOSVibrant
Light
Colors
margin
Config
material
Amber
material
Blue
material
Blue
Gray
material
Brown
material
Colors
material
Cyan
material
Deep
Orange
material
Deep
Purple
material
Gray
material
Green
material
Indigo
material
Light
Blue
material
Light
Green
material
Lime
material
Orange
material
Pink
material
Purple
material
Red
material
Teal
material
Yellow
mm
motions
ms
negative
Spacing
Config
none
object
Fit
Config
object
Position
Config
opacity
Config
orientations
outline
Offset
Config
overflow
Config
overscroll
Config
padding
Config
pc
percent
perspective
Config
perspective
Origin
Config
ping
Keyframes
place
Content
Config
place
Items
Config
place
Self
Config
position
Config
pt
pulse
Keyframes
px
rad
rem
ring
Offset
Config
roll
In
Keyframes
roll
Out
Keyframes
rotate
Config
rotate
In
Down
Left
Keyframes
rotate
In
Down
Right
Keyframes
rotate
In
Keyframes
rotate
In
Up
Left
Keyframes
rotate
In
Up
Right
Keyframes
rotate
Out
Down
Left
Keyframes
rotate
Out
Down
Right
Keyframes
rotate
Out
Keyframes
rotate
Out
Up
Left
Keyframes
rotate
Out
Up
Right
Keyframes
rubber
Band
Keyframes
s
saturate
Config
scale
Config
screens
sepia
Config
shakeXKeyframes
shakeYKeyframes
shock
Keyframes
skew
Config
slide
In
Down
Keyframes
slide
In
Left
Keyframes
slide
In
Right
Keyframes
slide
In
Up
Keyframes
slide
Out
Down
Keyframes
slide
Out
Left
Keyframes
slide
Out
Right
Keyframes
slide
Out
Up
Keyframes
space
Between
Config
spacing
Config
spin
Keyframes
stroke
Line
Cap
Config
stroke
Line
Join
Config
style
swing
Keyframes
t
Shirt
Scale
tab
Size
Config
table
Display
Config
tada
Keyframes
tailwind
Amber
tailwind
Blue
tailwind
Colors
tailwind
Cyan
tailwind
Emerald
tailwind
Fuchsia
tailwind
Gray
tailwind
Green
tailwind
Indigo
tailwind
Lime
tailwind
Neutral
tailwind
Orange
tailwind
Pink
tailwind
Purple
tailwind
Red
tailwind
Rose
tailwind
Sky
tailwind
Slate
tailwind
Stone
tailwind
Teal
tailwind
Violet
tailwind
Yellow
tailwind
Zinc
text
Align
Config
text
Decoration
Offset
Config
text
Decoration
Style
Config
text
Decoration
Thickness
Config
text
Decoration
Type
Config
text
Indent
Config
text
Shadow
Config
text
Stroke
Width
Config
text
Transform
Config
touch
Action
Config
transform
Origin
Config
transform
Style
Config
transforms
transition
Delay
Config
transition
Duration
Config
transition
Property
Config
transition
Timing
Function
Config
translate
Config
turn
unset
user
Select
Config
vertical
Align
Config
vh
vmax
vmin
vw
watchOSColors
web
Black
web
Blue
web
Brown
web
Colors
web
Cyan
web
Green
web
Orange
web
Pink
web
Purple
web
Red
web
White
web
Yellow
white
Space
Config
width
Config
windi
Colors
windi
Dark
windi
Light
wobble
Keyframes
writing
Mode
Config
writing
Orientation
Config
x
z
Index
Config
zoom
In
Down
Keyframes
zoom
In
Keyframes
zoom
In
Left
Keyframes
zoom
In
Right
Keyframes
zoom
In
Up
Keyframes
zoom
Out
Down
Keyframes
zoom
Out
Keyframes
zoom
Out
Left
Keyframes
zoom
Out
Right
Keyframes
zoom
Out
Up
Keyframes
$
$var
abs
add
adjust
Alpha
adjust
Blue
adjust
Green
adjust
Hue
adjust
Lightness
adjust
Red
adjust
Saturation
alpha
Count
alpha
Namer
animate
Handler
apply
apply
Variant
atomic
atomic
Namer
attr
background
Generic
Handler
base
Style
Handler
base
Style
Target
bind
blur
brightness
build
build
At
Rule
build
Backdrop
Filter
build
Box
Shadow
Color
build
Box
Shadow
Size
build
Color
build
Container
build
Decl
build
Divide
Color
build
Divide
Opacity
build
Divide
Style
build
DivideX
build
DivideY
build
Filter
build
Flex
Direction
build
Flex
Stretch
build
Font
Size
build
Gradient
Direction
build
Gradient
From
build
Gradient
To
build
Gradient
Via
build
Image
Rendering
build
Keyframes
build
Linear
Gradient
build
Not
Hidden
build
Placeholder
build
Property
build
Reverse
build
Ring
Width
build
Rule
build
Rules
build
Space
BetweenX
build
Space
BetweenY
build
Static
build
Transform
build
Transition
build
Writing
Mode
bundle
calc
call
Handler
camel
To
Dash
circle
clamp
color
Handler
color
Luminance
comma
Join
config
Handler
conic
Gradient
contrast
counter
counters
create
Dark
Mode
Variants
create
Media
create
Motion
Variants
create
Orientation
Variants
create
Rules
create
Screen
Variants
create
Utility
create
Variant
css
css
Handler
css
In
Js
Loader
cubic
Bezier
dash
To
Camel
dedup
Rules
define
Config
deg
Handler
degrees
digit
ToHEX
div
divideXReverse
Handler
divideYReverse
Handler
drop
Shadow
ellipse
entries
env
escapeCSS
fit
Content
font
Family
Handler
font
Size
Handler
frac
To
Percent
fraction
Handler
fractions
generic
Handler
get
Dark
Color
get
First
Var
get
Light
Color
get
Meta
get
Style
Ident
get
Style
Props
get
Style
Variants
get
Uid
grayscale
guard
handle
Config
handler
has
Key
hash
hash
Namer
hex
ToRGB
hsl
hsl
ToRGB
hsla
hue
Rotate
hue
ToRGB
hwb
hwb
ToRGB
injectCSS
inline
inset
invert
is
Color
is
Fraction
is
Gradient
is
Handler
is
Number
is
Position
is
Proxy
is
Size
is
Style
Object
is
Url
is
Var
Name
join
Filters
join
Transforms
linear
Gradient
matrix
matrix3d
max
media
meld
merge
Object
min
minmax
mix
Color
mountCSS
ms
Handler
mul
name
Style
negative
number
Handler
omit
opacity
paren
Wrap
path
perspective
polygon
prec
prefix
Animation
prefix
Image
Rendering
prefix
Keyframes
prefix
Not
Hidden
prefix
Placeholder
prefix
Writing
Mode
prefixer
prop
push
Meta
Prop
px
Handler
quote
radial
Gradient
range
rem
Handler
repeat
repeating
Conic
Gradient
repeating
Linear
Gradient
repeating
Radial
Gradient
reset
Meta
rgb
rgb
ToHEX
rgb
ToHSL
rgba
rotate
rotate3d
rotateX
rotateY
rotateZ
round
Up
saturate
scale
scale3d
scaleX
scaleY
scaleZ
scales
sepia
setup
setup
Handler
setup
Utility
setup
Variant
sign
skew
skewX
skewY
slice
Color
space
BetweenXReverse
Handler
space
BetweenYReverse
Handler
spacing
Handler
spacings
ssr
Loader
steps
style
Property
Handler
sub
sub
Mix
Color
translate
translate3d
translateX
translateY
translateZ
unify
unique
Id
update
Meta
Type
url
use
use
Array
Helper
use
Media
use
Namer
use
Style
Loader
use
Variant
variant