<div class="container m-4">

  <div class="card" style="max-width: 600px">

    <canvas class="m-5 justify-content-between" style="max-width: 500px; max-height: 500px"

  data-mdb-chart="pie"

  data-mdb-dataset-label="Traffic"

  data-mdb-labels="['darkest','darker','dark' , 'Primary' , 'light', 'lighter' , 'Lightest']"

  data-mdb-dataset-data="[800, 800, 800, 800, 800, 800, 800]"

  data-mdb-dataset-background-color="['HSL(170,100%,15%)','HSL(175,100%,20%)', 'HSL(175,70%,30%)', 

                                     'HSL(180,50%,40%)',

                                     'HSL(180,40%,50%)','HSL(180,40%,65%)','HSL(180,40%,80%)']"

></canvas>

  </div>

</div>