Particles CSSParticles CSSv0.0.10GitHub


Control the border and border-radius properties.


.borderborder: 1px solid;
.border-0border: 0;
.border-{1-4}border: {0.0625rem|0.125rem|0.25rem|0.5rem} solid;
.border-{solid|dashed|dotted|none}border-style: {solid|dashed|dotted|none};
.border-{color}-{number}border-color: {color};
.radius-0border-radius: 0;
.radius-fullborder-radius: 9999px;
.radius-{1-4}border-radius: {0.25rem|0.5rem|0.75rem|1rem};


VariableDefault Value
$borderWidths0.0625rem (1px), 0.125rem (2px), 0.25rem (4px), 0.5rem (8px)
$radii0.25rem (4px), 0.5rem (8px), 0.75rem (12px), 1rem (16px)


A shortcut for border: 1px solid;.

Border Width

Border Style

Border Color

See the colors section for more information about colors.

Border Radius

Specific Sides

You can specify each border property for a specific side by prefixing the border property in the classname with one of the following: t (top), b (bottom), l (left), r (right), y (top & bottom), x (left & right).

For border radius, you can also specify the specific corner with tl (top-left), tr (top-right), bl (bottom-left), br (bottom-right).