<template>
  <v-container>
    <v-row class="justify-space-around">
      <v-col cols="auto">
        <div class="text-center">
          <v-sheet border="primary thin" class="mx-auto" height="64" width="64" rounded></v-sheet>
          <div class="text-body-small">"primary thin"</div>
        </div>
      </v-col>

      <v-col cols="auto">
        <div class="text-center">
          <v-sheet border="success sm" height="64" width="64" rounded></v-sheet>
          <div class="text-body-small">"success sm"</div>
        </div>
      </v-col>

      <v-col cols="auto">
        <div class="text-center">
          <v-sheet border="info md" height="64" width="64" rounded></v-sheet>
          <div class="text-body-small">"info md"</div>
        </div>
      </v-col>

      <v-col cols="auto">
        <div class="text-center">
          <v-sheet border="warning lg" height="64" width="64" rounded></v-sheet>
          <div class="text-body-small">"warning lg"</div>
        </div>
      </v-col>

      <v-col cols="auto">
        <div class="text-center">
          <v-sheet border="error xl" height="64" width="64" rounded></v-sheet>
          <div class="text-body-small">"error xl"</div>
        </div>
      </v-col>
    </v-row>
  </v-container>
</template>
