How can I change the size of component with the slds token?

Question

I create a new layout for the recordpage.

In the middle region of the layout with the 8 boxes I want to insert different kind of reports. But I add the standard-report-component to the box then the box is to big (high).

I though I can change the size of the box with the standardtoken SLDS TOKEN but I don't know how can I do that. I want to try the different sizes like $size-small or $size-x-small.

    <div class="slds-grid slds-wrap">
  <div class="slds-size_5-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.record_top}</div>
  </div>
  <div class="slds-size_1-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.dashboard_1}</div>
  </div>
  <div class="slds-size_1-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.dashboard_2}</div>
  </div>
  <div class="slds-size_1-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.dashboard_3}</div>
  </div>
  <div class="slds-size_1-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.dashboard_4}</div>
  </div>
  <div class="slds-size_1-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.dashboard_5}</div>
  </div>    
  <div class="slds-size_3-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.record_main}</div>
  </div>
  <div class="slds-size_2-of-5">
    <div class="slds-box slds-box_xx-small slds-m-around_none">{!v.record_right}</div>
  </div>    
</div>