Making weird shapes and animating the CSS border-width

These can produce really funny results.

Borders on all sides same width

border-width: 100px;

See the Pen CSS border-width animation by hilja (@hilja) on CodePen

Borders only on left and right

border-width: 0px 100px 0px 100px;

See the Pen goruJ by hilja (@hilja) on CodePen

These can get crazy

See the Pen okDzd by hilja (@hilja) on CodePen

Club-Mate, the beverage →