Borders
bd
Property Modifiers
Elevate supports the following modifiers for the border
(abbreviated as bd
) property:
Modifier | Expected Values | Example |
---|---|---|
Width | SpacingToken (e.g., d3 ) | bd:width-d4 |
Style | solid , dashed , dotted , double , groove , ridge , inset , outset | bd:dashed |
Radius | SpacingToken (e.g., d3 ) | bd:round-d4 |
Color | ColorToken (e.g., purple+1 ) | bd:purple+1 |
Elevate also supports single directional variations for the bd
property such as:
Single Directional Properties | Expected Values | Example |
---|---|---|
bd-t | See Modifiers Above | bd-t:width-d4:purple+1 |
bd-b | See Modifiers Above | bd-b:round-d2:width-d2:dashed |
bd-l | See Modifiers Above | bd-l:width-d2:solid |
bd-r | See Modifiers Above | bd-r:width-d6:solid:indigo |