title: What is difference between v-app-bar and v-toolbar in vuetify?
body: <p>I just started exploring <a href="http://vuetifyjs.com/" rel="noreferrer">vuetify</a>. All the vuetify componets resides in <code>&lt;v-app&gt;</code>.<br>
  I wanted to create menu for my site so in documentation I found <code>&lt;v-app-bar&gt;</code> and <code>&lt;v-toolbar&gt;</code><br>
  I am confused that if I should keep menu items inside <code>&lt;v-app-bar&gt;</code> or <code>&lt;v-toolbar&gt;</code> as offical documentation says  </p>
  
  <p>About <code>&lt;v-app-bar&gt;</code> <a href="https://vuetifyjs.com/en/components/app-bars" rel="noreferrer">https://vuetifyjs.com/en/components/app-bars</a></p>
  
  <blockquote>
    <p>The <code>v-app-bar</code> component is pivotal to any graphical user interface
    (GUI), as it generally is the primary source of site navigation. The
    app-bar component works great in conjunction with a
    v-navigation-drawer for providing site navigation in your application.</p>
  </blockquote>
  
  <p>About <code>&lt;v-toolbar&gt;</code> <a href="https://vuetifyjs.com/en/components/toolbars" rel="noreferrer">https://vuetifyjs.com/en/components/toolbars</a></p>
  
  <blockquote>
    <p>The <code>v-toolbar</code> component is pivotal to any gui, as it generally is the
    primary source of site navigation. The toolbar component works great
    in conjunction with v-navigation-drawer and v-card.</p>
  </blockquote>
  
  <p>Both the description are almost same. What is difference in both and when we should use what? or we should use <code>v-toolbar</code> inside <code>v-app-bar</code>?</p>