MyQuasarComponent.vue

<template>
  <q-card>
    <q-card-section class="bg-primary text-white">
      <span class="text-h6">My Quasar component</span>
    </q-card-section>
    <q-card-section>
      <q-form>
        <q-input label="Hello" />
        <q-input label="Goodbye" />
      </q-form>
    </q-card-section>
  </q-card>
</template>

<script>
import { QCard, QCardSection, QForm, QInput, colors } from 'quasar'
export default {
  components: {
    QCard,
    QCardSection,
    QForm,
    QInput
  },
  created() {
    colors.setBrand('primary', '#33F')
    colors.setBrand('secondary', '#4f4')
  }
}
</script>

<style lang="stylus">
@import '../styles/quasar.styl';
</style>