Skip to content

Borders

bd Property Modifiers

Elevate supports the following modifiers for the border (abbreviated as bd) property:

ModifierExpected ValuesExample
WidthSpacingToken (e.g., d3)bd:width-d4
Stylesolid, dashed, dotted, double, groove, ridge, inset, outsetbd:dashed
RadiusSpacingToken (e.g., d3)bd:round-d4
ColorColorToken (e.g., purple+1)bd:purple+1


Elevate also supports single directional variations for the bd property such as:

Single Directional PropertiesExpected ValuesExample
bd-tSee Modifiers Abovebd-t:width-d4:purple+1
bd-bSee Modifiers Abovebd-b:round-d2:width-d2:dashed
bd-lSee Modifiers Abovebd-l:width-d2:solid
bd-rSee Modifiers Abovebd-r:width-d6:solid:indigo