Box

Boxes apply spacing, a border, and rounded corners to content areas.

Class Type
box Box A class representing a box
Box element
<div class="box">Box element</div>

Multiple Boxes

You stack multiple boxes on each other by using the boxes-wrapperclass. Middle boxes will appear without a border radius.

Top Box
Middle Box
Middle Box
Bottom Box
<div class="boxes-wrapper">
  <div class="box u-flex u-gap-16 u-cross-center">Top Box</div>
  <div class="box u-flex u-gap-16 u-cross-center">Middle Box</div>
  <div class="box u-flex u-gap-16 u-cross-center">Middle Box</div>
  <div class="box u-flex u-gap-16 u-cross-center">Bottom Box</div>
</div>