Basic.vue

<template>
  <div class="q-pa-md">
    <div class="text-purple q-gutter-md" style="font-size: 2em">
      <q-icon name="font_download" />
      <q-icon name="warning" />
      <q-icon name="format_size" />
      <q-icon name="print" />
      <q-icon name="today" />
      <q-icon name="style" />
    </div>

    <div class="q-mt-md q-gutter-md">
      <q-icon name="font_download" class="text-primary" style="font-size: 32px;" />
      <q-icon name="warning" class="text-red" style="font-size: 4rem;" />
      <q-icon name="format_size" style="color: #ccc; font-size: 1.4em;" />
      <q-icon name="print" class="text-teal" style="font-size: 4.4em;" />
      <q-icon name="today" class="text-orange" style="font-size: 2em;" />
      <q-icon name="style" style="font-size: 3em;" />
    </div>
  </div>
</template>