diff --git a/packages/docs/src/components/components/ApiExplorer.vue b/packages/docs/src/components/components/ApiExplorer.vue
index f441e2a51ca..430c73bf06a 100644
--- a/packages/docs/src/components/components/ApiExplorer.vue
+++ b/packages/docs/src/components/components/ApiExplorer.vue
@@ -14,10 +14,7 @@
         chips
         return-object
       >
-        <template
-          slot="selection"
-          slot-scope="props"
-        >
+        <template v-slot:selection="props">
           <v-chip
             :selected="props.selected"
             color="primary"
@@ -31,10 +28,7 @@
             <span v-text="props.item.text" />
           </v-chip>
         </template>
-        <template
-          slot="item"
-          slot-scope="props"
-        >
+        <template v-slot:item="props">
           <v-list-tile-action>
             <v-icon v-text="props.item.icon" />
           </v-list-tile-action>
diff --git a/packages/docs/src/components/core/Ecosystems.vue b/packages/docs/src/components/core/Ecosystems.vue
index 6df75834cee..8193203310d 100644
--- a/packages/docs/src/components/core/Ecosystems.vue
+++ b/packages/docs/src/components/core/Ecosystems.vue
@@ -6,19 +6,21 @@
     offset-y
     max-height="700"
   >
-    <v-btn
-      slot="activator"
-      :aria-label="$t('Vuetify.AppToolbar.ecosystem')"
-      flat
-      style="min-width: 48px"
-    >
-      <span
-        class="hidden-sm-and-down mr-1"
-        v-text="$t('Vuetify.AppToolbar.ecosystem')"
-      />
-      <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
-      <v-icon class="hidden-md-and-up">mdi-earth</v-icon>
-    </v-btn>
+    <template #activator="{ on: menu }">
+      <v-btn
+        :aria-label="$t('Vuetify.AppToolbar.ecosystem')"
+        flat
+        style="min-width: 48px"
+        v-on="menu"
+      >
+        <span
+          class="hidden-sm-and-down mr-1"
+          v-text="$t('Vuetify.AppToolbar.ecosystem')"
+        />
+        <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
+        <v-icon class="hidden-md-and-up">mdi-earth</v-icon>
+      </v-btn>
+    </template>
 
     <v-list
       light
diff --git a/packages/docs/src/components/core/Group.vue b/packages/docs/src/components/core/Group.vue
index 429233d1ec6..173c8ce438d 100644
--- a/packages/docs/src/components/core/Group.vue
+++ b/packages/docs/src/components/core/Group.vue
@@ -5,10 +5,9 @@
     :sub-group="subGroup"
     no-action
   >
-    <core-item
-      slot="activator"
-      :text="item.text"
-    />
+    <template v-slot:activator>
+      <core-item :text="item.text" />
+    </template>
     <template v-for="(child, i) in children">
       <core-sub-group
         v-if="child.group != null"
diff --git a/packages/docs/src/components/core/Locales.vue b/packages/docs/src/components/core/Locales.vue
index 1de084e5910..6f66f781319 100644
--- a/packages/docs/src/components/core/Locales.vue
+++ b/packages/docs/src/components/core/Locales.vue
@@ -5,19 +5,21 @@
     left
     offset-y
   >
-    <v-btn
-      slot="activator"
-      :aria-label="$t('Vuetify.AppToolbar.translations')"
-      flat
-      style="min-width: 48px"
-    >
-      <v-icon v-if="currentLanguage.locale === 'eo-UY'">language</v-icon>
-      <v-img
-        v-else
-        :src="`https://cdn.vuetifyjs.com/images/flags/${currentLanguage.country}.png`"
-        width="26px"
-      />
-    </v-btn>
+    <template #activator="{ on: menu }">
+      <v-btn
+        :aria-label="$t('Vuetify.AppToolbar.translations')"
+        flat
+        style="min-width: 48px"
+        v-on="menu"
+      >
+        <v-icon v-if="currentLanguage.locale === 'eo-UY'">language</v-icon>
+        <v-img
+          v-else
+          :src="`https://cdn.vuetifyjs.com/images/flags/${currentLanguage.country}.png`"
+          width="26px"
+        />
+      </v-btn>
+    </template>
     <v-list
       dense
       light
diff --git a/packages/docs/src/components/core/Supports.vue b/packages/docs/src/components/core/Supports.vue
index 2ca3f5c7b35..ccb8b7ee7d7 100644
--- a/packages/docs/src/components/core/Supports.vue
+++ b/packages/docs/src/components/core/Supports.vue
@@ -6,19 +6,21 @@
     offset-y
     max-height="500"
   >
-    <v-btn
-      slot="activator"
-      :aria-label="$t('Vuetify.AppToolbar.support')"
-      flat
-      style="min-width: 48px"
-    >
-      <span
-        class="hidden-sm-and-down mr-1"
-        v-text="$t('Vuetify.AppToolbar.support')"
-      />
-      <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
-      <v-icon class="hidden-md-and-up">mdi-comment-question</v-icon>
-    </v-btn>
+    <template #activator="{ on: menu }">
+      <v-btn
+        :aria-label="$t('Vuetify.AppToolbar.support')"
+        flat
+        style="min-width: 48px"
+        v-on="menu"
+      >
+        <span
+          class="hidden-sm-and-down mr-1"
+          v-text="$t('Vuetify.AppToolbar.support')"
+        />
+        <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
+        <v-icon class="hidden-md-and-up">mdi-comment-question</v-icon>
+      </v-btn>
+    </template>
     <v-list dense>
       <v-subheader v-text="$t('Vuetify.AppToolbar.getHelp')" />
       <core-item
diff --git a/packages/docs/src/components/core/Versions.vue b/packages/docs/src/components/core/Versions.vue
index 2e586c22b48..fa071b99784 100644
--- a/packages/docs/src/components/core/Versions.vue
+++ b/packages/docs/src/components/core/Versions.vue
@@ -6,17 +6,19 @@
     offset-y
     max-height="500"
   >
-    <v-btn
-      slot="activator"
-      class="hidden-md-and-down"
-      flat
-    >
-      <span
-        class="text-lowercase mr-1"
-        v-text="version"
-      />
-      <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
-    </v-btn>
+    <template #activator="{ on: menu }">
+      <v-btn
+        class="hidden-md-and-down"
+        flat
+        v-on="menu"
+      >
+        <span
+          class="text-lowercase mr-1"
+          v-text="version"
+        />
+        <v-icon class="hidden-sm-and-down">mdi-menu-down</v-icon>
+      </v-btn>
+    </template>
 
     <v-card>
       <v-list dense>
diff --git a/packages/docs/src/components/doc/Parameters.vue b/packages/docs/src/components/doc/Parameters.vue
index 556ea2f3a14..65e6a8f3822 100644
--- a/packages/docs/src/components/doc/Parameters.vue
+++ b/packages/docs/src/components/doc/Parameters.vue
@@ -16,10 +16,7 @@
       content-tag="v-layout"
       content-class="wrap"
     >
-      <template
-        slot="item"
-        slot-scope="{ item }"
-      >
+      <template v-slot:item="{ item }">
         <v-flex xs12 grey lighten-2 mt-2>
           <v-layout wrap px-2 py-1>
             <v-flex
diff --git a/packages/docs/src/components/getting-started/Faq.vue b/packages/docs/src/components/getting-started/Faq.vue
index e0d0016d7da..52bafab95f7 100644
--- a/packages/docs/src/components/getting-started/Faq.vue
+++ b/packages/docs/src/components/getting-started/Faq.vue
@@ -27,7 +27,7 @@
           content-class="v-data-iterator--faq"
           hide-actions
         >
-          <template slot="item" slot-scope="{ item: gotcha, index }">
+          <template v-slot:item="{ item: gotcha, index }">
             <div class="mb-5">
               <core-goto :id="`question-${index + 1}`">
                 <doc-markdown :code="gotcha.q" />
diff --git a/packages/docs/src/components/getting-started/Roadmap.vue b/packages/docs/src/components/getting-started/Roadmap.vue
index eb33c21659a..ebaa3bae6b4 100644
--- a/packages/docs/src/components/getting-started/Roadmap.vue
+++ b/packages/docs/src/components/getting-started/Roadmap.vue
@@ -9,9 +9,9 @@
         v-if="typeof item === 'number'"
         :key="`divider-${i}`"
       >
-        <span slot="opposite">
-          Completed
-        </span>
+        <template v-slot:opposite>
+          <span>Completed</span>
+        </template>
       </v-timeline-item>
       <v-timeline-item
         v-else-if="index == null || index >= i"
@@ -21,11 +21,12 @@
         :small="item.complete || item.small"
         fill-dot
       >
-        <strong
-          slot="opposite"
-          :class="index === i ? 'primary--text' : undefined"
-          v-text="item.caption"
-        />
+        <template v-slot:opposite>
+          <strong
+            :class="index === i ? 'primary--text' : undefined"
+            v-text="item.caption"
+          />
+        </template>
         <v-card
           :class="`elevation-${item.value ? 8 : 1}`"
           :hover="!item.complete"
diff --git a/packages/docs/src/components/themes/Premium.vue b/packages/docs/src/components/themes/Premium.vue
index 843b6e42c51..a1f4443becb 100644
--- a/packages/docs/src/components/themes/Premium.vue
+++ b/packages/docs/src/components/themes/Premium.vue
@@ -48,22 +48,23 @@
                 top
                 right
               >
-                <v-tooltip
-                  slot="activator"
-                  bottom
-                >
-                  <v-btn
-                    slot="activator"
-                    :href="template.demoUrl.length === 1 ? `${template.demoUrl[0]}?ref=vuetifyjs.com` : undefined"
-                    icon
-                    target="_blank"
-                    rel="noopener"
-                    aria-label="View Demo"
-                  >
-                    <v-icon color="primary">mdi-eye</v-icon>
-                  </v-btn>
-                  <span v-text="$t('Themes.Premium.viewDemo')" />
-                </v-tooltip>
+                <template #activator="{ on: menu }">
+                  <v-tooltip bottom>
+                    <template #activator="{ on: tooltip }">
+                      <v-btn
+                        :href="template.demoUrl.length === 1 ? `${template.demoUrl[0]}?ref=vuetifyjs.com` : undefined"
+                        icon
+                        target="_blank"
+                        rel="noopener"
+                        aria-label="View Demo"
+                        v-on="{ ...tooltip, ...menu }"
+                      >
+                        <v-icon color="primary">mdi-eye</v-icon>
+                      </v-btn>
+                    </template>
+                    <span v-text="$t('Themes.Premium.viewDemo')" />
+                  </v-tooltip>
+                </template>
                 <v-list v-if="template.demoUrl.length > 1">
                   <v-list-tile
                     v-for="([title, demo], i) in template.demoUrl"
diff --git a/packages/docs/src/examples/autocompletes/advanced.vue b/packages/docs/src/examples/autocompletes/advanced.vue
index 435c732c560..568a4a473ec 100644
--- a/packages/docs/src/examples/autocompletes/advanced.vue
+++ b/packages/docs/src/examples/autocompletes/advanced.vue
@@ -20,7 +20,7 @@
       label="Search for a coin..."
       solo
     >
-      <template slot="no-data">
+      <template v-slot:no-data>
         <v-list-tile>
           <v-list-tile-title>
             Search for your favorite
@@ -28,10 +28,7 @@
           </v-list-tile-title>
         </v-list-tile>
       </template>
-      <template
-        slot="selection"
-        slot-scope="{ item, selected }"
-      >
+      <template v-slot:selection="{ item, selected }">
         <v-chip
           :selected="selected"
           color="blue-grey"
@@ -41,10 +38,7 @@
           <span v-text="item.name"></span>
         </v-chip>
       </template>
-      <template
-        slot="item"
-        slot-scope="{ item }"
-      >
+      <template v-slot:item="{ item }">
         <v-list-tile-avatar
           color="indigo"
           class="headline font-weight-light white--text"
@@ -60,16 +54,17 @@
         </v-list-tile-action>
       </template>
     </v-autocomplete>
-    <v-tabs
-      slot="extension"
-      :hide-slider="!model"
-      color="transparent"
-      slider-color="blue-grey"
-    >
-      <v-tab :disabled="!model">News</v-tab>
-      <v-tab :disabled="!model">Trading</v-tab>
-      <v-tab :disabled="!model">Blog</v-tab>
-    </v-tabs>
+    <template v-slot:extension>
+      <v-tabs
+        :hide-slider="!model"
+        color="transparent"
+        slider-color="blue-grey"
+      >
+        <v-tab :disabled="!model">News</v-tab>
+        <v-tab :disabled="!model">Trading</v-tab>
+        <v-tab :disabled="!model">Blog</v-tab>
+      </v-tabs>
+    </template>
   </v-toolbar>
 </template>
 
diff --git a/packages/docs/src/examples/autocompletes/scopedSlots.vue b/packages/docs/src/examples/autocompletes/scopedSlots.vue
index 77fd92065cf..ab22ab3c345 100644
--- a/packages/docs/src/examples/autocompletes/scopedSlots.vue
+++ b/packages/docs/src/examples/autocompletes/scopedSlots.vue
@@ -26,12 +26,14 @@
             left
             transition="slide-y-transition"
           >
-            <v-btn
-              slot="activator"
-              icon
-            >
-              <v-icon>more_vert</v-icon>
-            </v-btn>
+            <template v-slot:activator="{ on }">
+              <v-btn
+                icon
+                v-on="on"
+              >
+                <v-icon>more_vert</v-icon>
+              </v-btn>
+            </template>
             <v-list>
               <v-list-tile @click="isUpdating = true">
                 <v-list-tile-action>
@@ -89,10 +91,7 @@
               item-value="name"
               multiple
             >
-              <template
-                slot="selection"
-                slot-scope="data"
-              >
+              <template v-slot:selection="data">
                 <v-chip
                   :selected="data.selected"
                   close
@@ -105,10 +104,7 @@
                   {{ data.item.name }}
                 </v-chip>
               </template>
-              <template
-                slot="item"
-                slot-scope="data"
-              >
+              <template v-slot:item="data">
                 <template v-if="typeof data.item !== 'object'">
                   <v-list-tile-content v-text="data.item"></v-list-tile-content>
                 </template>
diff --git a/packages/docs/src/examples/autocompletes/usage.vue b/packages/docs/src/examples/autocompletes/usage.vue
index 9313ddb3957..9e7ab776af4 100644
--- a/packages/docs/src/examples/autocompletes/usage.vue
+++ b/packages/docs/src/examples/autocompletes/usage.vue
@@ -12,17 +12,18 @@
         persistent-hint
         prepend-icon="mdi-city"
       >
-        <v-slide-x-reverse-transition
-          slot="append-outer"
-          mode="out-in"
-        >
-          <v-icon
-            :key="`icon-${isEditing}`"
-            :color="isEditing ? 'success' : 'info'"
-            @click="isEditing = !isEditing"
-            v-text="isEditing ? 'mdi-check-outline' : 'mdi-circle-edit-outline'"
-          ></v-icon>
-        </v-slide-x-reverse-transition>
+        <template v-slot:append-outer>
+          <v-slide-x-reverse-transition
+            mode="out-in"
+          >
+            <v-icon
+              :key="`icon-${isEditing}`"
+              :color="isEditing ? 'success' : 'info'"
+              @click="isEditing = !isEditing"
+              v-text="isEditing ? 'mdi-check-outline' : 'mdi-circle-edit-outline'"
+            ></v-icon>
+          </v-slide-x-reverse-transition>
+        </template>
       </v-autocomplete>
     </v-card-text>
   </v-card>
diff --git a/packages/docs/src/examples/avatars/advanced.vue b/packages/docs/src/examples/avatars/advanced.vue
index efa36bd8717..c2c36c5aea4 100644
--- a/packages/docs/src/examples/avatars/advanced.vue
+++ b/packages/docs/src/examples/avatars/advanced.vue
@@ -11,63 +11,63 @@
         :key="i"
         hide-actions
       >
-        <v-layout
-          slot="header"
-          align-center
-          row
-          spacer
-        >
-          <v-flex xs4 sm2 md1>
-            <v-avatar
-              slot="activator"
-              size="36px"
-            >
-              <img
-                v-if="message.avatar"
-                src="https://avatars0.githubusercontent.com/u/9064066?v=4&s=460"
-                alt="Avatar"
+        <template v-slot:header>
+          <v-layout
+            align-center
+            row
+            spacer
+          >
+            <v-flex xs4 sm2 md1>
+              <v-avatar
+                size="36px"
               >
-              <v-icon
-                v-else
-                :color="message.color"
-                v-text="message.icon"
-              ></v-icon>
-            </v-avatar>
-          </v-flex>
+                <img
+                  v-if="message.avatar"
+                  src="https://avatars0.githubusercontent.com/u/9064066?v=4&s=460"
+                  alt="Avatar"
+                >
+                <v-icon
+                  v-else
+                  :color="message.color"
+                  v-text="message.icon"
+                ></v-icon>
+              </v-avatar>
+            </v-flex>
 
-          <v-flex sm5 md3 hidden-xs-only>
-            <strong v-html="message.name"></strong>
-            <span
-              v-if="message.total"
-              class="grey--text"
-            >
-              &nbsp;({{ message.total }})
-            </span>
-          </v-flex>
+            <v-flex sm5 md3 hidden-xs-only>
+              <strong v-html="message.name"></strong>
+              <span
+                v-if="message.total"
+                class="grey--text"
+              >
+                &nbsp;({{ message.total }})
+              </span>
+            </v-flex>
 
-          <v-flex no-wrap xs5 sm3>
-            <v-chip
-              v-if="message.new"
-              :color="`${message.color} lighten-4`"
-              class="ml-0"
-              label
-              small
-            >
-              {{ message.new }} new
-            </v-chip>
-            <strong v-html="message.title"></strong>
-          </v-flex>
+            <v-flex no-wrap xs5 sm3>
+              <v-chip
+                v-if="message.new"
+                :color="`${message.color} lighten-4`"
+                class="ml-0"
+                label
+                small
+              >
+                {{ message.new }} new
+              </v-chip>
+              <strong v-html="message.title"></strong>
+            </v-flex>
 
-          <v-flex
-            v-if="message.excerpt"
-            class="grey--text"
-            ellipsis
-            hidden-sm-and-down
-          >
-            &mdash;
-            {{ message.excerpt }}
-          </v-flex>
-        </v-layout>
+            <v-flex
+              v-if="message.excerpt"
+              class="grey--text"
+              ellipsis
+              hidden-sm-and-down
+            >
+              &mdash;
+              {{ message.excerpt }}
+            </v-flex>
+          </v-layout>
+        </template>
 
         <v-card>
           <v-divider></v-divider>
diff --git a/packages/docs/src/examples/avatars/iconAndText.vue b/packages/docs/src/examples/avatars/iconAndText.vue
index 165786eabbb..eb9698019c0 100644
--- a/packages/docs/src/examples/avatars/iconAndText.vue
+++ b/packages/docs/src/examples/avatars/iconAndText.vue
@@ -16,7 +16,9 @@
     </v-avatar>
 
     <v-badge overlap>
-      <span slot="badge">3</span>
+      <template v-slot:badge>
+        <span>3</span>
+      </template>
 
       <v-avatar
         color="purple red--after"
diff --git a/packages/docs/src/examples/badges/icon.vue b/packages/docs/src/examples/badges/icon.vue
index 338a47bfb84..8dddfe7e65b 100644
--- a/packages/docs/src/examples/badges/icon.vue
+++ b/packages/docs/src/examples/badges/icon.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="text-xs-center">
     <v-badge left color="purple">
-      <v-icon slot="badge" dark small>mdi-adjust</v-icon>
+      <template v-slot:badge>
+        <v-icon dark small>mdi-adjust</v-icon>
+      </template>
       <span>
         MDI icon
       </span>
@@ -10,7 +12,9 @@
     &nbsp;&nbsp;
 
     <v-badge color="orange">
-      <v-icon slot="badge" dark small>fas fa-fighter-jet</v-icon>
+      <template v-slot:badge>
+        <v-icon dark small>fas fa-fighter-jet</v-icon>
+      </template>
       <span>
         Font Awesome icon
       </span>
diff --git a/packages/docs/src/examples/badges/inline.vue b/packages/docs/src/examples/badges/inline.vue
index f0bb06604fa..1cd435beff7 100644
--- a/packages/docs/src/examples/badges/inline.vue
+++ b/packages/docs/src/examples/badges/inline.vue
@@ -1,14 +1,18 @@
 <template>
   <div class="text-xs-center">
     <v-badge left>
-      <span slot="badge">2</span>
+      <template v-slot:badge>
+        <span>2</span>
+      </template>
       <span>Examples</span>
     </v-badge>
 
     &nbsp;&nbsp;
 
     <v-badge color="green">
-      <v-icon slot="badge" dark small>list</v-icon>
+      <template v-slot:badge>
+        <v-icon dark small>list</v-icon>
+      </template>
       <span>Lists</span>
     </v-badge>
   </div>
diff --git a/packages/docs/src/examples/badges/overlap.vue b/packages/docs/src/examples/badges/overlap.vue
index a54af158236..00639886712 100644
--- a/packages/docs/src/examples/badges/overlap.vue
+++ b/packages/docs/src/examples/badges/overlap.vue
@@ -5,11 +5,14 @@
       left
       overlap
     >
-      <v-icon
-        slot="badge"
-        dark
-        small
-      >done</v-icon>
+      <template v-slot:badge>
+        <v-icon
+          dark
+          small
+        >
+          done
+        </v-icon>
+      </template>
       <v-icon
         color="grey lighten-1"
         large
@@ -22,11 +25,14 @@
       overlap
       color="orange"
     >
-      <v-icon
-        slot="badge"
-        dark
-        small
-      >notifications</v-icon>
+      <template v-slot:badge>
+        <v-icon
+          dark
+          small
+        >
+          notifications
+        </v-icon>
+      </template>
       <v-icon
         large
         color="grey darken-1"
diff --git a/packages/docs/src/examples/badges/usage.vue b/packages/docs/src/examples/badges/usage.vue
index 20a919db467..78e2579b90a 100644
--- a/packages/docs/src/examples/badges/usage.vue
+++ b/packages/docs/src/examples/badges/usage.vue
@@ -1,7 +1,9 @@
 <template>
   <div class="text-xs-center">
     <v-badge left>
-      <span slot="badge">6</span>
+      <template v-slot:badge>
+        <span>6</span>
+      </template>
       <v-icon
         large
         color="grey lighten-1"
@@ -11,7 +13,9 @@
     </v-badge>
 
     <v-badge color="red">
-      <span slot="badge">!</span>
+      <template v-slot:badge>
+        <span>!</span>
+      </template>
       <v-icon
         large
         color="grey"
diff --git a/packages/docs/src/examples/badges/visibility.vue b/packages/docs/src/examples/badges/visibility.vue
index 6871d659cf3..3fb111969c4 100644
--- a/packages/docs/src/examples/badges/visibility.vue
+++ b/packages/docs/src/examples/badges/visibility.vue
@@ -21,7 +21,9 @@
           color="cyan"
           left
         >
-          <span slot="badge">6</span>
+          <template v-slot:badge>
+            <span>6</span>
+          </template>
           <v-icon
             large
             color="grey lighten-1"
@@ -32,7 +34,9 @@
           v-model="show"
           color="purple"
         >
-          <span slot="badge">6</span>
+          <template v-slot:badge>
+            <span>6</span>
+          </template>
           <v-icon large color="grey">mail</v-icon>
         </v-badge>
       </v-flex>
diff --git a/packages/docs/src/examples/bottom-sheets/inset.vue b/packages/docs/src/examples/bottom-sheets/inset.vue
index 76a6afde166..86f3afafa70 100644
--- a/packages/docs/src/examples/bottom-sheets/inset.vue
+++ b/packages/docs/src/examples/bottom-sheets/inset.vue
@@ -1,14 +1,14 @@
 <template>
   <div class="text-xs-center">
     <v-bottom-sheet inset>
-      <v-btn
-        slot="activator"
-        color="red"
-        dark
-      >
-        Show player
-      </v-btn>
-
+      <template v-slot:activator>
+        <v-btn
+          color="red"
+          dark
+        >
+          Show player
+        </v-btn>
+      </template>
       <v-card tile>
         <v-progress-linear
           :value="50"
diff --git a/packages/docs/src/examples/bottom-sheets/usage.vue b/packages/docs/src/examples/bottom-sheets/usage.vue
index afb84a2dd9b..cdfa32c07e1 100644
--- a/packages/docs/src/examples/bottom-sheets/usage.vue
+++ b/packages/docs/src/examples/bottom-sheets/usage.vue
@@ -1,14 +1,14 @@
 <template>
   <div class="text-xs-center">
     <v-bottom-sheet v-model="sheet">
-      <v-btn
-        slot="activator"
-        color="purple"
-        dark
-      >
-        Click me
-      </v-btn>
-
+      <template v-slot:activator>
+        <v-btn
+          color="purple"
+          dark
+        >
+          Click me
+        </v-btn>
+      </template>
       <v-list>
         <v-subheader>Open in</v-subheader>
         <v-list-tile
diff --git a/packages/docs/src/examples/breadcrumbs/iconDividers.vue b/packages/docs/src/examples/breadcrumbs/iconDividers.vue
index 8f7ca01c4ed..41b4fe94c63 100644
--- a/packages/docs/src/examples/breadcrumbs/iconDividers.vue
+++ b/packages/docs/src/examples/breadcrumbs/iconDividers.vue
@@ -1,11 +1,15 @@
 <template>
   <div>
     <v-breadcrumbs :items="items">
-      <v-icon slot="divider">forward</v-icon>
+      <template v-slot:divider>
+        <v-icon>forward</v-icon>
+      </template>
     </v-breadcrumbs>
 
     <v-breadcrumbs :items="items">
-      <v-icon slot="divider">chevron_right</v-icon>
+      <template v-slot:divider>
+        <v-icon>chevron_right</v-icon>
+      </template>
     </v-breadcrumbs>
   </div>
 </template>
diff --git a/packages/docs/src/examples/breadcrumbs/itemSlot.vue b/packages/docs/src/examples/breadcrumbs/itemSlot.vue
index 4366f68a808..501f8b45fdf 100644
--- a/packages/docs/src/examples/breadcrumbs/itemSlot.vue
+++ b/packages/docs/src/examples/breadcrumbs/itemSlot.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <v-breadcrumbs :items="items">
-      <template slot="item" slot-scope="props">
+      <template v-slot:item="props">
         <a :href="props.item.href" :class="[props.item.disabled && 'disabled']">{{ props.item.text.toUpperCase() }}</a>
       </template>
     </v-breadcrumbs>
diff --git a/packages/docs/src/examples/buttons/loaders.vue b/packages/docs/src/examples/buttons/loaders.vue
index df4dc158e2c..594c3344caf 100644
--- a/packages/docs/src/examples/buttons/loaders.vue
+++ b/packages/docs/src/examples/buttons/loaders.vue
@@ -27,7 +27,9 @@
       @click="loader = 'loading2'"
     >
       Custom Loader
-      <span slot="loader">Loading...</span>
+      <template v-slot:loader>
+        <span>Loading...</span>
+      </template>
     </v-btn>
 
     <v-btn
@@ -37,9 +39,11 @@
       @click="loader = 'loading4'"
     >
       Icon Loader
-      <span slot="loader" class="custom-loader">
-        <v-icon light>cached</v-icon>
-      </span>
+      <template v-slot:loader>
+        <span class="custom-loader">
+          <v-icon light>cached</v-icon>
+        </span>
+      </template>
     </v-btn>
   </div>
 </template>
diff --git a/packages/docs/src/examples/calendars/daily.vue b/packages/docs/src/examples/calendars/daily.vue
index f3b75a1a406..b696e3d20fd 100644
--- a/packages/docs/src/examples/calendars/daily.vue
+++ b/packages/docs/src/examples/calendars/daily.vue
@@ -6,22 +6,16 @@
           color="primary"
           type="day"
         >
-          <template
-            slot="dayHeader"
-            slot-scope="{ present }"
-          >
-            <div
+          <template v-slot:dayHeader="{ present }">
+            <template
               v-if="present"
               class="text-xs-center"
             >
               Today
-            </div>
+            </template>
           </template>
 
-          <template
-            slot="interval"
-            slot-scope="{ hour }"
-          >
+          <template v-slot:interval="{ hour }">
             <div
               class="text-xs-center"
             >
diff --git a/packages/docs/src/examples/calendars/events.vue b/packages/docs/src/examples/calendars/events.vue
index 9fbd4dd30d7..12502f81c78 100644
--- a/packages/docs/src/examples/calendars/events.vue
+++ b/packages/docs/src/examples/calendars/events.vue
@@ -7,10 +7,7 @@
           :value="today"
           color="primary"
         >
-          <template
-            slot="day"
-            slot-scope="{ date }"
-          >
+          <template v-slot:day="{ date }">
             <template v-for="event in eventsMap[date]">
               <v-menu
                 :key="event.title"
@@ -18,13 +15,15 @@
                 full-width
                 offset-x
               >
-                <div
-                  v-if="!event.time"
-                  slot="activator"
-                  v-ripple
-                  class="my-event"
-                  v-html="event.title"
-                ></div>
+                <template v-slot:activator="{ on }">
+                  <div
+                    v-if="!event.time"
+                    v-ripple
+                    class="my-event"
+                    v-on="on"
+                    v-html="event.title"
+                  ></div>
+                </template>
                 <v-card
                   color="grey lighten-4"
                   min-width="350px"
diff --git a/packages/docs/src/examples/calendars/features.vue b/packages/docs/src/examples/calendars/features.vue
index 123d00f5ed9..b2caae98c6d 100644
--- a/packages/docs/src/examples/calendars/features.vue
+++ b/packages/docs/src/examples/calendars/features.vue
@@ -60,13 +60,15 @@
         offset-y
         full-width
       >
-        <v-text-field
-          slot="activator"
-          v-model="start"
-          label="Start Date"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="start"
+            label="Start Date"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker
           v-model="start"
           no-title
@@ -102,13 +104,15 @@
         offset-y
         full-width
       >
-        <v-text-field
-          slot="activator"
-          v-model="end"
-          label="End Date"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="end"
+            label="End Date"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker
           v-model="end"
           no-title
@@ -143,13 +147,15 @@
         offset-y
         full-width
       >
-        <v-text-field
-          slot="activator"
-          v-model="now"
-          label="Today"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="now"
+            label="Today"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker
           v-model="now"
           no-title
@@ -227,10 +233,7 @@
           :show-interval-label="showIntervalLabel"
           :color="color"
         >
-          <template
-            slot="day"
-            slot-scope="day"
-          >
+          <template v-slot:day="day">
             <div
               v-if="day.day % 3 === 0"
               class="day"
@@ -238,10 +241,7 @@
               day slot {{ day.date }}
             </div>
           </template>
-          <template
-            slot="day-header"
-            slot-scope="day"
-          >
+          <template v-slot:header="day">
             <div
               v-if="day.weekday % 2"
               class="day-header"
@@ -249,10 +249,7 @@
               day-header slot {{ day.date }}
             </div>
           </template>
-          <template
-            slot="day-body"
-            slot-scope="day"
-          >
+          <template v-slot:day-body="day">
             <div
               v-if="day.weekday % 3 === 2"
               class="day-body"
diff --git a/packages/docs/src/examples/calendars/slots.vue b/packages/docs/src/examples/calendars/slots.vue
index b8eec2d6f3a..58b5582df7e 100644
--- a/packages/docs/src/examples/calendars/slots.vue
+++ b/packages/docs/src/examples/calendars/slots.vue
@@ -7,23 +7,23 @@
           :value="today"
           color="primary"
         >
-          <v-layout
-            slot="day"
-            slot-scope="{ present, past, date }"
-            fill-height
-          >
-            <template v-if="past && tracked[date]">
-              <v-sheet
-                v-for="(percent, i) in tracked[date]"
-                :key="i"
-                :title="category[i]"
-                :color="colors[i]"
-                :width="`${percent}%`"
-                height="100%"
-                tile
-              ></v-sheet>
-            </template>
-          </v-layout>
+          <template v-slot:day="{ present, past, date }">
+            <v-layout
+              fill-height
+            >
+              <template v-if="past && tracked[date]">
+                <v-sheet
+                  v-for="(percent, i) in tracked[date]"
+                  :key="i"
+                  :title="category[i]"
+                  :color="colors[i]"
+                  :width="`${percent}%`"
+                  height="100%"
+                  tile
+                ></v-sheet>
+              </template>
+            </v-layout>
+          </template>
         </v-calendar>
       </v-sheet>
     </v-flex>
diff --git a/packages/docs/src/examples/calendars/weekly.vue b/packages/docs/src/examples/calendars/weekly.vue
index df30442926d..0e388e176a1 100644
--- a/packages/docs/src/examples/calendars/weekly.vue
+++ b/packages/docs/src/examples/calendars/weekly.vue
@@ -11,10 +11,7 @@
           type="week"
         >
           <!-- the events at the top (all-day) -->
-          <template
-            slot="dayHeader"
-            slot-scope="{ date }"
-          >
+          <template v-slot:dayHeadere="{ date }">
             <template v-for="event in eventsMap[date]">
               <!-- all day events don't have time -->
               <div
@@ -27,10 +24,7 @@
             </template>
           </template>
           <!-- the events at the bottom (timed) -->
-          <template
-            slot="dayBody"
-            slot-scope="{ date, timeToY, minutesToPixels }"
-          >
+          <template v-slot:dayBody="{ date, timeToY, minutesToPixels }">
             <template v-for="event in eventsMap[date]">
               <!-- timed events -->
               <div
diff --git a/packages/docs/src/examples/chips/inSelects.vue b/packages/docs/src/examples/chips/inSelects.vue
index 69f18f2fe91..e9beaa81724 100644
--- a/packages/docs/src/examples/chips/inSelects.vue
+++ b/packages/docs/src/examples/chips/inSelects.vue
@@ -9,7 +9,7 @@
     solo
     multiple
   >
-    <template slot="selection" slot-scope="data">
+    <template v-slot:selection="data">
       <v-chip
         :selected="data.selected"
         close
diff --git a/packages/docs/src/examples/combobox/advanced.vue b/packages/docs/src/examples/combobox/advanced.vue
index 698344c3890..de8cefa3d1a 100644
--- a/packages/docs/src/examples/combobox/advanced.vue
+++ b/packages/docs/src/examples/combobox/advanced.vue
@@ -11,7 +11,7 @@
     small-chips
     solo
   >
-    <template slot="no-data">
+    <template v-slot:no-data>
       <v-list-tile>
         <span class="subheading">Create</span>
         <v-chip
@@ -23,12 +23,9 @@
         </v-chip>
       </v-list-tile>
     </template>
-    <template
-      v-if="item === Object(item)"
-      slot="selection"
-      slot-scope="{ item, parent, selected }"
-    >
+    <template v-slot:selection="{ item, parent, selected }">
       <v-chip
+        v-if="item === Object(item)"
         :color="`${item.color} lighten-3`"
         :selected="selected"
         label
@@ -43,10 +40,7 @@
         >close</v-icon>
       </v-chip>
     </template>
-    <template
-      slot="item"
-      slot-scope="{ index, item }"
-    >
+    <template v-slot:item="{ index, item }">
       <v-list-tile-content>
         <v-text-field
           v-if="editing === item"
diff --git a/packages/docs/src/examples/combobox/comboboxMultiple.vue b/packages/docs/src/examples/combobox/comboboxMultiple.vue
index 9227e6e9075..04dcb51bd00 100644
--- a/packages/docs/src/examples/combobox/comboboxMultiple.vue
+++ b/packages/docs/src/examples/combobox/comboboxMultiple.vue
@@ -26,10 +26,7 @@
           multiple
           chips
         >
-          <template
-            slot="selection"
-            slot-scope="data"
-          >
+          <template v-slot:selection="data">
             <v-chip
               :key="JSON.stringify(data.item)"
               :selected="data.selected"
diff --git a/packages/docs/src/examples/combobox/noData.vue b/packages/docs/src/examples/combobox/noData.vue
index 6904151504b..89528268386 100644
--- a/packages/docs/src/examples/combobox/noData.vue
+++ b/packages/docs/src/examples/combobox/noData.vue
@@ -10,7 +10,7 @@
     persistent-hint
     small-chips
   >
-    <template slot="no-data">
+    <template v-slot:no-data>
       <v-list-tile>
         <v-list-tile-content>
           <v-list-tile-title>
diff --git a/packages/docs/src/examples/combobox/usage.vue b/packages/docs/src/examples/combobox/usage.vue
index 5df60d63019..dd3bd5662b4 100644
--- a/packages/docs/src/examples/combobox/usage.vue
+++ b/packages/docs/src/examples/combobox/usage.vue
@@ -23,7 +23,7 @@
           chips
           label="I use a scoped slot"
         >
-          <template slot="selection" slot-scope="data">
+          <template v-slot:selection="data">
             <v-chip
               :key="JSON.stringify(data.item)"
               :selected="data.selected"
diff --git a/packages/docs/src/examples/data-iterator/slots.vue b/packages/docs/src/examples/data-iterator/slots.vue
index 17c685ca0b0..32061dd0f86 100644
--- a/packages/docs/src/examples/data-iterator/slots.vue
+++ b/packages/docs/src/examples/data-iterator/slots.vue
@@ -9,78 +9,78 @@
       row
       wrap
     >
-      <v-toolbar
-        slot="header"
-        class="mb-2"
-        color="indigo darken-5"
-        dark
-        flat
-      >
-        <v-toolbar-title>This is a header</v-toolbar-title>
-      </v-toolbar>
+      <template v-slot:header>
+        <v-toolbar
+          class="mb-2"
+          color="indigo darken-5"
+          dark
+          flat
+        >
+          <v-toolbar-title>This is a header</v-toolbar-title>
+        </v-toolbar>
+      </template>
+      <template v-slot:item="props">
+        <v-flex
+          xs12
+          sm6
+          md4
+          lg3
+        >
+          <v-card>
+            <v-card-title class="subheading font-weight-bold">{{ props.item.name }}</v-card-title>
 
-      <v-flex
-        slot="item"
-        slot-scope="props"
-        xs12
-        sm6
-        md4
-        lg3
-      >
-        <v-card>
-          <v-card-title class="subheading font-weight-bold">{{ props.item.name }}</v-card-title>
+            <v-divider></v-divider>
 
-          <v-divider></v-divider>
+            <v-list dense>
+              <v-list-tile>
+                <v-list-tile-content>Calories:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.calories }}</v-list-tile-content>
+              </v-list-tile>
 
-          <v-list dense>
-            <v-list-tile>
-              <v-list-tile-content>Calories:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.calories }}</v-list-tile-content>
-            </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Fat:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.fat }}</v-list-tile-content>
+              </v-list-tile>
 
-            <v-list-tile>
-              <v-list-tile-content>Fat:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.fat }}</v-list-tile-content>
-            </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Carbs:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.carbs }}</v-list-tile-content>
+              </v-list-tile>
 
-            <v-list-tile>
-              <v-list-tile-content>Carbs:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.carbs }}</v-list-tile-content>
-            </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Protein:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.protein }}</v-list-tile-content>
+              </v-list-tile>
 
-            <v-list-tile>
-              <v-list-tile-content>Protein:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.protein }}</v-list-tile-content>
-            </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Sodium:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.sodium }}</v-list-tile-content>
+              </v-list-tile>
 
-            <v-list-tile>
-              <v-list-tile-content>Sodium:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.sodium }}</v-list-tile-content>
-            </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Calcium:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.calcium }}</v-list-tile-content>
+              </v-list-tile>
 
-            <v-list-tile>
-              <v-list-tile-content>Calcium:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.calcium }}</v-list-tile-content>
-            </v-list-tile>
-
-            <v-list-tile>
-              <v-list-tile-content>Iron:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.iron }}</v-list-tile-content>
-            </v-list-tile>
-          </v-list>
-        </v-card>
-      </v-flex>
-
-      <v-toolbar
-        slot="footer"
-        class="mt-2"
-        color="indigo"
-        dark
-        dense
-        flat
-      >
-        <v-toolbar-title class="subheading">This is a footer</v-toolbar-title>
-      </v-toolbar>
+              <v-list-tile>
+                <v-list-tile-content>Iron:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.iron }}</v-list-tile-content>
+              </v-list-tile>
+            </v-list>
+          </v-card>
+        </v-flex>
+      </template>
+      <template v-slot:footer>
+        <v-toolbar
+          class="mt-2"
+          color="indigo"
+          dark
+          dense
+          flat
+        >
+          <v-toolbar-title class="subheading">This is a footer</v-toolbar-title>
+        </v-toolbar>
+      </template>
     </v-data-iterator>
   </v-container>
 </template>
diff --git a/packages/docs/src/examples/data-iterator/usage.vue b/packages/docs/src/examples/data-iterator/usage.vue
index 57acaa22504..aec68a778d3 100644
--- a/packages/docs/src/examples/data-iterator/usage.vue
+++ b/packages/docs/src/examples/data-iterator/usage.vue
@@ -8,49 +8,49 @@
       row
       wrap
     >
-      <v-flex
-        slot="item"
-        slot-scope="props"
-        xs12
-        sm6
-        md4
-        lg3
-      >
-        <v-card>
-          <v-card-title><h4>{{ props.item.name }}</h4></v-card-title>
-          <v-divider></v-divider>
-          <v-list dense>
-            <v-list-tile>
-              <v-list-tile-content>Calories:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.calories }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Fat:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.fat }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Carbs:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.carbs }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Protein:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.protein }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Sodium:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.sodium }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Calcium:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.calcium }}</v-list-tile-content>
-            </v-list-tile>
-            <v-list-tile>
-              <v-list-tile-content>Iron:</v-list-tile-content>
-              <v-list-tile-content class="align-end">{{ props.item.iron }}</v-list-tile-content>
-            </v-list-tile>
-          </v-list>
-        </v-card>
-      </v-flex>
+      <template v-slot:item="props">
+        <v-flex
+          xs12
+          sm6
+          md4
+          lg3
+        >
+          <v-card>
+            <v-card-title><h4>{{ props.item.name }}</h4></v-card-title>
+            <v-divider></v-divider>
+            <v-list dense>
+              <v-list-tile>
+                <v-list-tile-content>Calories:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.calories }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Fat:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.fat }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Carbs:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.carbs }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Protein:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.protein }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Sodium:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.sodium }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Calcium:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.calcium }}</v-list-tile-content>
+              </v-list-tile>
+              <v-list-tile>
+                <v-list-tile-content>Iron:</v-list-tile-content>
+                <v-list-tile-content class="align-end">{{ props.item.iron }}</v-list-tile-content>
+              </v-list-tile>
+            </v-list>
+          </v-card>
+        </v-flex>
+      </template>
     </v-data-iterator>
   </v-container>
 </template>
diff --git a/packages/docs/src/examples/data-tables/crud.vue b/packages/docs/src/examples/data-tables/crud.vue
index 1ffe7e043ba..8f25fec11c0 100644
--- a/packages/docs/src/examples/data-tables/crud.vue
+++ b/packages/docs/src/examples/data-tables/crud.vue
@@ -9,7 +9,9 @@
       ></v-divider>
       <v-spacer></v-spacer>
       <v-dialog v-model="dialog" max-width="500px">
-        <v-btn slot="activator" color="primary" dark class="mb-2">New Item</v-btn>
+        <template v-slot:activator="{ on }">
+          <v-btn color="primary" dark class="mb-2" v-on="on">New Item</v-btn>
+        </template>
         <v-card>
           <v-card-title>
             <span class="headline">{{ formTitle }}</span>
@@ -50,7 +52,7 @@
       :items="desserts"
       class="elevation-1"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
@@ -72,7 +74,7 @@
           </v-icon>
         </td>
       </template>
-      <template slot="no-data">
+      <template v-slot:no-data>
         <v-btn color="primary" @click="initialize">Reset</v-btn>
       </template>
     </v-data-table>
diff --git a/packages/docs/src/examples/data-tables/customIcons.vue b/packages/docs/src/examples/data-tables/customIcons.vue
index 18194076399..7f4d371ad48 100644
--- a/packages/docs/src/examples/data-tables/customIcons.vue
+++ b/packages/docs/src/examples/data-tables/customIcons.vue
@@ -7,7 +7,7 @@
     next-icon="mdi-menu-right"
     sort-icon="mdi-menu-down"
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/editdialog.vue b/packages/docs/src/examples/data-tables/editdialog.vue
index ac0f3127a64..e7104cc62b9 100644
--- a/packages/docs/src/examples/data-tables/editdialog.vue
+++ b/packages/docs/src/examples/data-tables/editdialog.vue
@@ -4,7 +4,7 @@
       :headers="headers"
       :items="desserts"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>
           <v-edit-dialog
             :return-value.sync="props.item.name"
@@ -14,14 +14,15 @@
             @open="open"
             @close="close"
           > {{ props.item.name }}
-            <v-text-field
-              slot="input"
-              v-model="props.item.name"
-              :rules="[max25chars]"
-              label="Edit"
-              single-line
-              counter
-            ></v-text-field>
+            <template v-slot:input>
+              <v-text-field
+                v-model="props.item.name"
+                :rules="[max25chars]"
+                label="Edit"
+                single-line
+                counter
+              ></v-text-field>
+            </template>
           </v-edit-dialog>
         </td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
@@ -40,16 +41,19 @@
             @close="close"
           >
             <div>{{ props.item.iron }}</div>
-            <div slot="input" class="mt-3 title">Update Iron</div>
-            <v-text-field
-              slot="input"
-              v-model="props.item.iron"
-              :rules="[max25chars]"
-              label="Edit"
-              single-line
-              counter
-              autofocus
-            ></v-text-field>
+            <template v-slot:input>
+              <div class="mt-3 title">Update Iron</div>
+            </template>
+            <template v-slot:input>
+              <v-text-field
+                v-model="props.item.iron"
+                :rules="[max25chars]"
+                label="Edit"
+                single-line
+                counter
+                autofocus
+              ></v-text-field>
+            </template>
           </v-edit-dialog>
         </td>
       </template>
diff --git a/packages/docs/src/examples/data-tables/expand.vue b/packages/docs/src/examples/data-tables/expand.vue
index f68e8404bdb..6815fa2f4a6 100644
--- a/packages/docs/src/examples/data-tables/expand.vue
+++ b/packages/docs/src/examples/data-tables/expand.vue
@@ -14,7 +14,7 @@
       :expand="expand"
       item-key="name"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <tr @click="props.expanded = !props.expanded">
           <td>{{ props.item.name }}</td>
           <td class="text-xs-right">{{ props.item.calories }}</td>
@@ -24,7 +24,7 @@
           <td class="text-xs-right">{{ props.item.iron }}</td>
         </tr>
       </template>
-      <template slot="expand" slot-scope="props">
+      <template v-slot:expand="props">
         <v-card flat>
           <v-card-text>Peek-a-boo!</v-card-text>
         </v-card>
diff --git a/packages/docs/src/examples/data-tables/footer.vue b/packages/docs/src/examples/data-tables/footer.vue
index 6cce9df6540..ba82f751e03 100644
--- a/packages/docs/src/examples/data-tables/footer.vue
+++ b/packages/docs/src/examples/data-tables/footer.vue
@@ -4,7 +4,7 @@
     :items="desserts"
     class="elevation-1"
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
@@ -12,7 +12,7 @@
       <td class="text-xs-right">{{ props.item.protein }}</td>
       <td class="text-xs-right">{{ props.item.iron }}</td>
     </template>
-    <template slot="footer">
+    <template v-slot:footer>
       <td :colspan="headers.length">
         <strong>This is an extra footer</strong>
       </td>
diff --git a/packages/docs/src/examples/data-tables/headerCell.vue b/packages/docs/src/examples/data-tables/headerCell.vue
index 75075d847c0..fbbf47dde05 100644
--- a/packages/docs/src/examples/data-tables/headerCell.vue
+++ b/packages/docs/src/examples/data-tables/headerCell.vue
@@ -4,17 +4,19 @@
     :items="desserts"
     class="elevation-1"
   >
-    <template slot="headerCell" slot-scope="props">
+    <template v-slot:headerCell="props">
       <v-tooltip bottom>
-        <span slot="activator">
-          {{ props.header.text }}
-        </span>
+        <template v-slot:activator="{ on }">
+          <span v-on="on">
+            {{ props.header.text }}
+          </span>
+        </template>
         <span>
           {{ props.header.text }}
         </span>
       </v-tooltip>
     </template>
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/headerless.vue b/packages/docs/src/examples/data-tables/headerless.vue
index 8996d77299b..4c6240dc00c 100644
--- a/packages/docs/src/examples/data-tables/headerless.vue
+++ b/packages/docs/src/examples/data-tables/headerless.vue
@@ -5,7 +5,7 @@
     hide-actions
     hide-headers
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/headers.vue b/packages/docs/src/examples/data-tables/headers.vue
index cc89f7e4a1d..a75cd95655c 100644
--- a/packages/docs/src/examples/data-tables/headers.vue
+++ b/packages/docs/src/examples/data-tables/headers.vue
@@ -8,7 +8,7 @@
     item-key="name"
     class="elevation-1"
   >
-    <template slot="headers" slot-scope="props">
+    <template v-slot:headers="props">
       <tr>
         <th>
           <v-checkbox
@@ -30,7 +30,7 @@
         </th>
       </tr>
     </template>
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <tr :active="props.selected" @click="props.selected = !props.selected">
         <td>
           <v-checkbox
diff --git a/packages/docs/src/examples/data-tables/noData.vue b/packages/docs/src/examples/data-tables/noData.vue
index 61c0d6778de..6705e4329ab 100644
--- a/packages/docs/src/examples/data-tables/noData.vue
+++ b/packages/docs/src/examples/data-tables/noData.vue
@@ -4,7 +4,7 @@
     :items="desserts"
     class="elevation-1"
   >
-    <template slot="no-data">
+    <template v-slot:no-data>
       <v-alert :value="true" color="error" icon="warning">
         Sorry, nothing to display here :(
       </v-alert>
diff --git a/packages/docs/src/examples/data-tables/pageText.vue b/packages/docs/src/examples/data-tables/pageText.vue
index 78fbf20b117..bfb29d7c28a 100644
--- a/packages/docs/src/examples/data-tables/pageText.vue
+++ b/packages/docs/src/examples/data-tables/pageText.vue
@@ -4,7 +4,7 @@
     :items="desserts"
     class="elevation-1"
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
@@ -12,7 +12,7 @@
       <td class="text-xs-right">{{ props.item.protein }}</td>
       <td class="text-xs-right">{{ props.item.iron }}</td>
     </template>
-    <template slot="pageText" slot-scope="props">
+    <template v-slot:pageText="props">
       Lignes {{ props.pageStart }} - {{ props.pageStop }} de {{ props.itemsLength }}
     </template>
   </v-data-table>
diff --git a/packages/docs/src/examples/data-tables/paginate.vue b/packages/docs/src/examples/data-tables/paginate.vue
index b01e52b5bd7..13c16cff814 100644
--- a/packages/docs/src/examples/data-tables/paginate.vue
+++ b/packages/docs/src/examples/data-tables/paginate.vue
@@ -8,7 +8,7 @@
       :pagination.sync="pagination"
       class="elevation-1"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/progress.vue b/packages/docs/src/examples/data-tables/progress.vue
index a656371779f..d4ae836aabc 100644
--- a/packages/docs/src/examples/data-tables/progress.vue
+++ b/packages/docs/src/examples/data-tables/progress.vue
@@ -5,8 +5,8 @@
     :loading="true"
     class="elevation-1"
   >
-    <v-progress-linear slot="progress" color="blue" indeterminate></v-progress-linear>
-    <template slot="items" slot-scope="props">
+    <v-progress-linear v-slot:progress color="blue" indeterminate></v-progress-linear>
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/search.vue b/packages/docs/src/examples/data-tables/search.vue
index 2900c7b3b5c..1fde081f8f6 100644
--- a/packages/docs/src/examples/data-tables/search.vue
+++ b/packages/docs/src/examples/data-tables/search.vue
@@ -16,7 +16,7 @@
       :items="desserts"
       :search="search"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
@@ -24,7 +24,7 @@
         <td class="text-xs-right">{{ props.item.protein }}</td>
         <td class="text-xs-right">{{ props.item.iron }}</td>
       </template>
-      <v-alert slot="no-results" :value="true" color="error" icon="warning">
+      <v-alert v-slot:no-results :value="true" color="error" icon="warning">
         Your search for "{{ search }}" found no results.
       </v-alert>
     </v-data-table>
diff --git a/packages/docs/src/examples/data-tables/select.vue b/packages/docs/src/examples/data-tables/select.vue
index 7a9052a14e7..b0d8b732985 100644
--- a/packages/docs/src/examples/data-tables/select.vue
+++ b/packages/docs/src/examples/data-tables/select.vue
@@ -7,7 +7,7 @@
     select-all
     class="elevation-1"
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>
         <v-checkbox
           v-model="props.selected"
diff --git a/packages/docs/src/examples/data-tables/server.vue b/packages/docs/src/examples/data-tables/server.vue
index 0bec28952c0..d06eaab6d00 100644
--- a/packages/docs/src/examples/data-tables/server.vue
+++ b/packages/docs/src/examples/data-tables/server.vue
@@ -8,7 +8,7 @@
       :loading="loading"
       class="elevation-1"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/sort.vue b/packages/docs/src/examples/data-tables/sort.vue
index 99a4a12abe2..017bbc51e07 100644
--- a/packages/docs/src/examples/data-tables/sort.vue
+++ b/packages/docs/src/examples/data-tables/sort.vue
@@ -7,7 +7,7 @@
       :pagination.sync="pagination"
       class="elevation-1"
     >
-      <template slot="items" slot-scope="props">
+      <template v-slot:items="props">
         <td>{{ props.item.name }}</td>
         <td class="text-xs-right">{{ props.item.calories }}</td>
         <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/data-tables/usage.vue b/packages/docs/src/examples/data-tables/usage.vue
index 29b75215a3f..635bad25b3e 100644
--- a/packages/docs/src/examples/data-tables/usage.vue
+++ b/packages/docs/src/examples/data-tables/usage.vue
@@ -4,7 +4,7 @@
     :items="desserts"
     class="elevation-1"
   >
-    <template slot="items" slot-scope="props">
+    <template v-slot:items="props">
       <td>{{ props.item.name }}</td>
       <td class="text-xs-right">{{ props.item.calories }}</td>
       <td class="text-xs-right">{{ props.item.fat }}</td>
diff --git a/packages/docs/src/examples/date-pickers/dateBirthday.vue b/packages/docs/src/examples/date-pickers/dateBirthday.vue
index 910bb19157e..dbaf55c2799 100644
--- a/packages/docs/src/examples/date-pickers/dateBirthday.vue
+++ b/packages/docs/src/examples/date-pickers/dateBirthday.vue
@@ -10,13 +10,15 @@
     full-width
     min-width="290px"
   >
-    <v-text-field
-      slot="activator"
-      v-model="date"
-      label="Birthday date"
-      prepend-icon="event"
-      readonly
-    ></v-text-field>
+    <template v-slot:activator="{ on }">
+      <v-text-field
+        v-model="date"
+        label="Birthday date"
+        prepend-icon="event"
+        readonly
+        v-on="on"
+      ></v-text-field>
+    </template>
     <v-date-picker
       ref="picker"
       v-model="date"
diff --git a/packages/docs/src/examples/date-pickers/dateDialogAndMenu.vue b/packages/docs/src/examples/date-pickers/dateDialogAndMenu.vue
index 783b2ec7269..eabca62cfa9 100644
--- a/packages/docs/src/examples/date-pickers/dateDialogAndMenu.vue
+++ b/packages/docs/src/examples/date-pickers/dateDialogAndMenu.vue
@@ -13,13 +13,15 @@
         full-width
         min-width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="date"
-          label="Picker in menu"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="date"
+            label="Picker in menu"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker v-model="date" no-title scrollable>
           <v-spacer></v-spacer>
           <v-btn flat color="primary" @click="menu = false">Cancel</v-btn>
@@ -38,13 +40,15 @@
         full-width
         width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="date"
-          label="Picker in dialog"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="date"
+            label="Picker in dialog"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker v-model="date" scrollable>
           <v-spacer></v-spacer>
           <v-btn flat color="primary" @click="modal = false">Cancel</v-btn>
@@ -63,13 +67,15 @@
         full-width
         min-width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="date"
-          label="Picker without buttons"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="date"
+            label="Picker without buttons"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker v-model="date" @input="menu2 = false"></v-date-picker>
       </v-menu>
     </v-flex>
diff --git a/packages/docs/src/examples/date-pickers/dateFormatting.vue b/packages/docs/src/examples/date-pickers/dateFormatting.vue
index c87d241059b..68c0265467c 100644
--- a/packages/docs/src/examples/date-pickers/dateFormatting.vue
+++ b/packages/docs/src/examples/date-pickers/dateFormatting.vue
@@ -14,15 +14,17 @@
           max-width="290px"
           min-width="290px"
         >
-          <v-text-field
-            slot="activator"
-            v-model="dateFormatted"
-            label="Date"
-            hint="MM/DD/YYYY format"
-            persistent-hint
-            prepend-icon="event"
-            @blur="date = parseDate(dateFormatted)"
-          ></v-text-field>
+          <template v-slot:activator="{ on }">
+            <v-text-field
+              v-model="dateFormatted"
+              label="Date"
+              hint="MM/DD/YYYY format"
+              persistent-hint
+              prepend-icon="event"
+              @blur="date = parseDate(dateFormatted)"
+              v-on="on"
+            ></v-text-field>
+          </template>
           <v-date-picker v-model="date" no-title @input="menu1 = false"></v-date-picker>
         </v-menu>
         <p>Date in ISO format: <strong>{{ date }}</strong></p>
@@ -40,15 +42,17 @@
           max-width="290px"
           min-width="290px"
         >
-          <v-text-field
-            slot="activator"
-            v-model="computedDateFormatted"
-            label="Date (read only text field)"
-            hint="MM/DD/YYYY format"
-            persistent-hint
-            prepend-icon="event"
-            readonly
-          ></v-text-field>
+          <template v-slot:activator="{ on }">
+            <v-text-field
+              v-model="computedDateFormatted"
+              label="Date (read only text field)"
+              hint="MM/DD/YYYY format"
+              persistent-hint
+              prepend-icon="event"
+              readonly
+              v-on="on"
+            ></v-text-field>
+          </template>
           <v-date-picker v-model="date" no-title @input="menu2 = false"></v-date-picker>
         </v-menu>
         <p>Date in ISO format: <strong>{{ date }}</strong></p>
diff --git a/packages/docs/src/examples/date-pickers/dateFormattingMomentDatefns.vue b/packages/docs/src/examples/date-pickers/dateFormattingMomentDatefns.vue
index 2f745f4049e..9f12d004f6d 100644
--- a/packages/docs/src/examples/date-pickers/dateFormattingMomentDatefns.vue
+++ b/packages/docs/src/examples/date-pickers/dateFormattingMomentDatefns.vue
@@ -8,13 +8,15 @@
           full-width
           max-width="290"
         >
-          <v-text-field
-            slot="activator"
-            :value="computedDateFormattedMomentjs"
-            clearable
-            label="Formatted with Moment.js"
-            readonly
-          ></v-text-field>
+          <template v-slot:activator="{ on }">
+            <v-text-field
+              :value="computedDateFormattedMomentjs"
+              clearable
+              label="Formatted with Moment.js"
+              readonly
+              v-on="on"
+            ></v-text-field>
+          </template>
           <v-date-picker
             v-model="date"
             @change="menu1 = false"
@@ -29,13 +31,15 @@
           full-width
           max-width="290"
         >
-          <v-text-field
-            slot="activator"
-            :value="computedDateFormattedDatefns"
-            clearable
-            label="Formatted with datefns"
-            readonly
-          ></v-text-field>
+          <template v-slot:activator="{ on }">
+            <v-text-field
+              :value="computedDateFormattedDatefns"
+              clearable
+              label="Formatted with datefns"
+              readonly
+              v-on="on"
+            ></v-text-field>
+          </template>
           <v-date-picker
             v-model="date"
             @change="menu2 = false"
diff --git a/packages/docs/src/examples/date-pickers/dateMultiple.vue b/packages/docs/src/examples/date-pickers/dateMultiple.vue
index 2e018951af6..798ab04184f 100644
--- a/packages/docs/src/examples/date-pickers/dateMultiple.vue
+++ b/packages/docs/src/examples/date-pickers/dateMultiple.vue
@@ -19,16 +19,18 @@
         full-width
         min-width="290px"
       >
-        <v-combobox
-          slot="activator"
-          v-model="dates"
-          multiple
-          chips
-          small-chips
-          label="Multiple picker in menu"
-          prepend-icon="event"
-          readonly
-        ></v-combobox>
+        <template v-slot:activator="{ on }">
+          <v-combobox
+            v-model="dates"
+            multiple
+            chips
+            small-chips
+            label="Multiple picker in menu"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-combobox>
+        </template>
         <v-date-picker v-model="dates" multiple no-title scrollable>
           <v-spacer></v-spacer>
           <v-btn flat color="primary" @click="menu = false">Cancel</v-btn>
diff --git a/packages/docs/src/examples/date-pickers/monthDialogAndMenu.vue b/packages/docs/src/examples/date-pickers/monthDialogAndMenu.vue
index 1473eb8282c..5095f55831f 100644
--- a/packages/docs/src/examples/date-pickers/monthDialogAndMenu.vue
+++ b/packages/docs/src/examples/date-pickers/monthDialogAndMenu.vue
@@ -14,13 +14,15 @@
         max-width="290px"
         min-width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="date"
-          label="Picker in menu"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="date"
+            label="Picker in menu"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker
           v-model="date"
           type="month"
@@ -44,13 +46,15 @@
         full-width
         width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="date"
-          label="Picker in dialog"
-          prepend-icon="event"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="date"
+            label="Picker in dialog"
+            prepend-icon="event"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-date-picker v-model="date" type="month" scrollable>
           <v-spacer></v-spacer>
           <v-btn flat color="primary" @click="modal = false">Cancel</v-btn>
diff --git a/packages/docs/src/examples/dialogs/advanced.vue b/packages/docs/src/examples/dialogs/advanced.vue
index 8938ad07c41..1061ee99d5b 100644
--- a/packages/docs/src/examples/dialogs/advanced.vue
+++ b/packages/docs/src/examples/dialogs/advanced.vue
@@ -5,7 +5,9 @@
       <v-btn color="primary" dark @click="dialog2 = true">Open Dialog 2</v-btn>
       <v-btn color="primary" dark @click="dialog3 = true">Open Dialog 3</v-btn>
       <v-menu bottom offset-y>
-        <v-btn slot="activator">A Menu</v-btn>
+        <template v-slot:activator="{ on }">
+          <v-btn v-on="on">A Menu</v-btn>
+        </template>
         <v-list>
           <v-list-tile v-for="(item, i) in items" :key="i" @click="">
             <v-list-tile-title>{{ item.title }}</v-list-tile-title>
@@ -30,9 +32,11 @@
               <v-btn dark flat @click="dialog = false">Save</v-btn>
             </v-toolbar-items>
             <v-menu bottom right offset-y>
-              <v-btn slot="activator" dark icon>
-                <v-icon>more_vert</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn dark icon v-on="on">
+                  <v-icon>more_vert</v-icon>
+                </v-btn>
+              </template>
               <v-list>
                 <v-list-tile v-for="(item, i) in items" :key="i" @click="">
                   <v-list-tile-title>{{ item.title }}</v-list-tile-title>
@@ -43,7 +47,9 @@
           <v-card-text>
             <v-btn color="primary" dark @click="dialog2 = !dialog2">Open Dialog 2</v-btn>
             <v-tooltip right>
-              <v-btn slot="activator">Tool Tip Activator</v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn v-on="on">Tool Tip Activator</v-btn>
+              </template>
               Tool Tip
             </v-tooltip>
             <v-list three-line subheader>
@@ -121,9 +127,11 @@
             <span>Dialog 3</span>
             <v-spacer></v-spacer>
             <v-menu bottom left>
-              <v-btn slot="activator" icon>
-                <v-icon>more_vert</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon v-on="on">
+                  <v-icon>more_vert</v-icon>
+                </v-btn>
+              </template>
               <v-list>
                 <v-list-tile v-for="(item, i) in items" :key="i" @click="">
                   <v-list-tile-title>{{ item.title }}</v-list-tile-title>
diff --git a/packages/docs/src/examples/dialogs/form.vue b/packages/docs/src/examples/dialogs/form.vue
index f58f762ee24..190da897c6f 100644
--- a/packages/docs/src/examples/dialogs/form.vue
+++ b/packages/docs/src/examples/dialogs/form.vue
@@ -1,7 +1,9 @@
 <template>
   <v-layout row justify-center>
     <v-dialog v-model="dialog" persistent max-width="600px">
-      <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
+      </template>
       <v-card>
         <v-card-title>
           <span class="headline">User Profile</span>
diff --git a/packages/docs/src/examples/dialogs/fullscreen.vue b/packages/docs/src/examples/dialogs/fullscreen.vue
index af42b2cf812..830acaf9f3c 100644
--- a/packages/docs/src/examples/dialogs/fullscreen.vue
+++ b/packages/docs/src/examples/dialogs/fullscreen.vue
@@ -1,7 +1,9 @@
 <template>
   <v-layout row justify-center>
     <v-dialog v-model="dialog" fullscreen hide-overlay transition="dialog-bottom-transition">
-      <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
+      </template>
       <v-card>
         <v-toolbar dark color="primary">
           <v-btn icon dark @click="dialog = false">
diff --git a/packages/docs/src/examples/dialogs/modal.vue b/packages/docs/src/examples/dialogs/modal.vue
index c862c78682d..d220634d8ef 100644
--- a/packages/docs/src/examples/dialogs/modal.vue
+++ b/packages/docs/src/examples/dialogs/modal.vue
@@ -1,7 +1,9 @@
 <template>
   <v-layout row justify-center>
     <v-dialog v-model="dialog" persistent max-width="290">
-      <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
+      </template>
       <v-card>
         <v-card-title class="headline">Use Google's location service?</v-card-title>
         <v-card-text>Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.</v-card-text>
diff --git a/packages/docs/src/examples/dialogs/overflowed.vue b/packages/docs/src/examples/dialogs/overflowed.vue
index 9a0ef8b0712..1d5a21db530 100644
--- a/packages/docs/src/examples/dialogs/overflowed.vue
+++ b/packages/docs/src/examples/dialogs/overflowed.vue
@@ -1,7 +1,9 @@
 <template>
   <v-layout row justify-center>
     <v-dialog v-model="dialog" width="600px">
-      <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
+      </template>
       <v-card>
         <v-card-title>
           <span class="headline">Use Google's location service?</span>
diff --git a/packages/docs/src/examples/dialogs/scrollable.vue b/packages/docs/src/examples/dialogs/scrollable.vue
index 841757661ee..08a86e0e1e7 100644
--- a/packages/docs/src/examples/dialogs/scrollable.vue
+++ b/packages/docs/src/examples/dialogs/scrollable.vue
@@ -1,7 +1,9 @@
 <template>
   <v-layout row justify-center>
     <v-dialog v-model="dialog" scrollable max-width="300px">
-      <v-btn slot="activator" color="primary" dark>Open Dialog</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Open Dialog</v-btn>
+      </template>
       <v-card>
         <v-card-title>Select Country</v-card-title>
         <v-divider></v-divider>
diff --git a/packages/docs/src/examples/dialogs/usage.vue b/packages/docs/src/examples/dialogs/usage.vue
index c346b1f35a6..d4db93ba952 100644
--- a/packages/docs/src/examples/dialogs/usage.vue
+++ b/packages/docs/src/examples/dialogs/usage.vue
@@ -4,13 +4,15 @@
       v-model="dialog"
       width="500"
     >
-      <v-btn
-        slot="activator"
-        color="red lighten-2"
-        dark
-      >
-        Click Me
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          color="red lighten-2"
+          dark
+          v-on="on"
+        >
+          Click Me
+        </v-btn>
+      </template>
 
       <v-card>
         <v-card-title
diff --git a/packages/docs/src/examples/expansion-panels/customIcons.vue b/packages/docs/src/examples/expansion-panels/customIcons.vue
index 5c8b6410823..2e534947f5f 100644
--- a/packages/docs/src/examples/expansion-panels/customIcons.vue
+++ b/packages/docs/src/examples/expansion-panels/customIcons.vue
@@ -5,7 +5,9 @@
       :key="i"
       expand-icon="mdi-menu-down"
     >
-      <div slot="header">Item</div>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/disabledAndReadonly.vue b/packages/docs/src/examples/expansion-panels/disabledAndReadonly.vue
index 1c6e8786825..687445c8804 100644
--- a/packages/docs/src/examples/expansion-panels/disabledAndReadonly.vue
+++ b/packages/docs/src/examples/expansion-panels/disabledAndReadonly.vue
@@ -18,7 +18,7 @@
       expand
     >
       <v-expansion-panel-content disabled>
-        <template slot="header">Disabled</template>
+        <template v-slot:header>Disabled</template>
         <v-card>
           <v-card-text>
             Disabled content. Style is changed and user is unable to toggle content.
@@ -27,7 +27,7 @@
       </v-expansion-panel-content>
 
       <v-expansion-panel-content readonly>
-        <template slot="header">Readonly</template>
+        <template v-slot:header>Readonly</template>
         <v-card>
           <v-card-text>
             Readonly content. Style is unchanged but user is unable to toggle content.
@@ -36,7 +36,7 @@
       </v-expansion-panel-content>
 
       <v-expansion-panel-content>
-        <template slot="header">Regular</template>
+        <template v-slot:header>Regular</template>
         <v-card>
           <v-card-text>Some content</v-card-text>
         </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/expand.vue b/packages/docs/src/examples/expansion-panels/expand.vue
index 50b91f354f0..7e1b83b767f 100644
--- a/packages/docs/src/examples/expansion-panels/expand.vue
+++ b/packages/docs/src/examples/expansion-panels/expand.vue
@@ -9,7 +9,9 @@
         v-for="(item, i) in 5"
         :key="i"
       >
-        <div slot="header">Item</div>
+        <template v-slot:header>
+          <div>Item</div>
+        </template>
         <v-card>
           <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
         </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/external.vue b/packages/docs/src/examples/expansion-panels/external.vue
index ef9151c4306..1bc7edd8e25 100644
--- a/packages/docs/src/examples/expansion-panels/external.vue
+++ b/packages/docs/src/examples/expansion-panels/external.vue
@@ -13,7 +13,9 @@
         v-for="(item,i) in items"
         :key="i"
       >
-        <div slot="header">Item</div>
+        <template v-slot:header>
+          <div>Item</div>
+        </template>
         <v-card>
           <v-card-text>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
         </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/focusable.vue b/packages/docs/src/examples/expansion-panels/focusable.vue
index 4dfb723b67a..8334645d2bc 100644
--- a/packages/docs/src/examples/expansion-panels/focusable.vue
+++ b/packages/docs/src/examples/expansion-panels/focusable.vue
@@ -4,7 +4,9 @@
       v-for="(item,i) in 5"
       :key="i"
     >
-      <div slot="header">Item</div>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/iconSlot.vue b/packages/docs/src/examples/expansion-panels/iconSlot.vue
index 03f52f9fcff..e9f23c798c9 100644
--- a/packages/docs/src/examples/expansion-panels/iconSlot.vue
+++ b/packages/docs/src/examples/expansion-panels/iconSlot.vue
@@ -1,22 +1,34 @@
 <template>
   <v-expansion-panel>
     <v-expansion-panel-content>
-      <v-icon slot="actions" color="primary">$vuetify.icons.expand</v-icon>
-      <div slot="header">Item</div>
+      <template v-slot:actions>
+        <v-icon color="primary">$vuetify.icons.expand</v-icon>
+      </template>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
     </v-expansion-panel-content>
     <v-expansion-panel-content>
-      <v-icon slot="actions" color="teal">done</v-icon>
-      <div slot="header">Item</div>
+      <template v-slot:actions>
+        <v-icon color="teal">done</v-icon>
+      </template>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
     </v-expansion-panel-content>
     <v-expansion-panel-content>
-      <v-icon slot="actions" color="error">error</v-icon>
-      <div slot="header">Item</div>
+      <template v-slot:actions>
+        <v-icon color="error">error</v-icon>
+      </template>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text class="grey lighten-3">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/popout.vue b/packages/docs/src/examples/expansion-panels/popout.vue
index bdb7a6a3363..7f22a207dd6 100644
--- a/packages/docs/src/examples/expansion-panels/popout.vue
+++ b/packages/docs/src/examples/expansion-panels/popout.vue
@@ -7,7 +7,9 @@
             v-for="(item,i) in 5"
             :key="i"
           >
-            <div slot="header">Item</div>
+            <template v-slot:header>
+              <div>Item</div>
+            </template>
             <v-card>
               <v-card-text>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
             </v-card>
@@ -21,7 +23,9 @@
             v-for="(item,i) in 5"
             :key="i"
           >
-            <div slot="header">Item</div>
+            <template v-slot:header>
+              <div>Item</div>
+            </template>
             <v-card>
               <v-card-text>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
             </v-card>
diff --git a/packages/docs/src/examples/expansion-panels/usage.vue b/packages/docs/src/examples/expansion-panels/usage.vue
index 48aadba3d17..4537d637b43 100644
--- a/packages/docs/src/examples/expansion-panels/usage.vue
+++ b/packages/docs/src/examples/expansion-panels/usage.vue
@@ -4,7 +4,9 @@
       v-for="(item,i) in 5"
       :key="i"
     >
-      <div slot="header">Item</div>
+      <template v-slot:header>
+        <div>Item</div>
+      </template>
       <v-card>
         <v-card-text>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</v-card-text>
       </v-card>
diff --git a/packages/docs/src/examples/floating-action-buttons/lateralScreens.vue b/packages/docs/src/examples/floating-action-buttons/lateralScreens.vue
index 732075b3fe4..348655cfab1 100644
--- a/packages/docs/src/examples/floating-action-buttons/lateralScreens.vue
+++ b/packages/docs/src/examples/floating-action-buttons/lateralScreens.vue
@@ -10,17 +10,18 @@
       <v-btn icon>
         <v-icon>more_vert</v-icon>
       </v-btn>
-      <v-tabs
-        slot="extension"
-        v-model="tabs"
-        align-with-title
-        color="transparent"
-      >
-        <v-tab href="#one">Item One</v-tab>
-        <v-tab href="#two">Item Two</v-tab>
-        <v-tab href="#three">Item Three</v-tab>
-        <v-tabs-slider color="pink"></v-tabs-slider>
-      </v-tabs>
+      <template v-slot:extension>
+        <v-tabs
+          v-model="tabs"
+          align-with-title
+          color="transparent"
+        >
+          <v-tab href="#one">Item One</v-tab>
+          <v-tab href="#two">Item Two</v-tab>
+          <v-tab href="#three">Item Three</v-tab>
+          <v-tabs-slider color="pink"></v-tabs-slider>
+        </v-tabs>
+      </template>
     </v-toolbar>
     <v-tabs-items v-model="tabs">
       <v-tab-item
diff --git a/packages/docs/src/examples/floating-action-buttons/small.vue b/packages/docs/src/examples/floating-action-buttons/small.vue
index 66c5c2d7fc5..b26443940bf 100644
--- a/packages/docs/src/examples/floating-action-buttons/small.vue
+++ b/packages/docs/src/examples/floating-action-buttons/small.vue
@@ -15,7 +15,9 @@
           >
             <v-icon>add</v-icon>
           </v-btn>
-          <v-toolbar-title slot="extension" class="white--text">My files</v-toolbar-title>
+          <template v-slot:extension>
+            <v-toolbar-title class="white--text">My files</v-toolbar-title>
+          </template>
           <v-spacer></v-spacer>
           <v-btn icon>
             <v-icon>search</v-icon>
diff --git a/packages/docs/src/examples/floating-action-buttons/speedDial.vue b/packages/docs/src/examples/floating-action-buttons/speedDial.vue
index 43900c87d56..fee3d432458 100644
--- a/packages/docs/src/examples/floating-action-buttons/speedDial.vue
+++ b/packages/docs/src/examples/floating-action-buttons/speedDial.vue
@@ -44,16 +44,17 @@
       :open-on-hover="hover"
       :transition="transition"
     >
-      <v-btn
-        slot="activator"
-        v-model="fab"
-        color="blue darken-2"
-        dark
-        fab
-      >
-        <v-icon>account_circle</v-icon>
-        <v-icon>close</v-icon>
-      </v-btn>
+      <template v-slot:activator>
+        <v-btn
+          v-model="fab"
+          color="blue darken-2"
+          dark
+          fab
+        >
+          <v-icon>account_circle</v-icon>
+          <v-icon>close</v-icon>
+        </v-btn>
+      </template>
       <v-btn
         fab
         dark
diff --git a/packages/docs/src/examples/images/usage.vue b/packages/docs/src/examples/images/usage.vue
index f71c9f06e04..8790cf1319c 100644
--- a/packages/docs/src/examples/images/usage.vue
+++ b/packages/docs/src/examples/images/usage.vue
@@ -17,15 +17,16 @@
                   aspect-ratio="1"
                   class="grey lighten-2"
                 >
-                  <v-layout
-                    slot="placeholder"
-                    fill-height
-                    align-center
-                    justify-center
-                    ma-0
-                  >
-                    <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
-                  </v-layout>
+                  <template v-slot:placeholder>
+                    <v-layout
+                      fill-height
+                      align-center
+                      justify-center
+                      ma-0
+                    >
+                      <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
+                    </v-layout>
+                  </template>
                 </v-img>
               </v-card>
             </v-flex>
diff --git a/packages/docs/src/examples/layouts/baseline.vue b/packages/docs/src/examples/layouts/baseline.vue
index d7b75051d2f..6ce5de46cf6 100644
--- a/packages/docs/src/examples/layouts/baseline.vue
+++ b/packages/docs/src/examples/layouts/baseline.vue
@@ -36,15 +36,19 @@
         >
           <v-flex text-xs-center>
             <v-tooltip left>
-              <v-btn slot="activator" :href="source" icon large target="_blank">
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/rJdVMq" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/rJdVMq" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/layouts/baselineFlipped.vue b/packages/docs/src/examples/layouts/baselineFlipped.vue
index b6263082eff..a468bf7e394 100644
--- a/packages/docs/src/examples/layouts/baselineFlipped.vue
+++ b/packages/docs/src/examples/layouts/baselineFlipped.vue
@@ -35,15 +35,19 @@
         <v-layout justify-center align-center>
           <v-flex text-xs-center>
             <v-tooltip left>
-              <v-btn slot="activator" :href="source" icon large target="_blank">
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/BYqXgr" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/BYqXgr" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/layouts/centered.vue b/packages/docs/src/examples/layouts/centered.vue
index d9489877f12..4cc50006230 100644
--- a/packages/docs/src/examples/layouts/centered.vue
+++ b/packages/docs/src/examples/layouts/centered.vue
@@ -9,21 +9,19 @@
                 <v-toolbar-title>Login form</v-toolbar-title>
                 <v-spacer></v-spacer>
                 <v-tooltip bottom>
-                  <v-btn
-                    slot="activator"
-                    :href="source"
-                    icon
-                    large
-                    target="_blank"
-                  >
-                    <v-icon large>code</v-icon>
-                  </v-btn>
+                  <template v-slot:activator="{ on }">
+                    <v-btn :href="source" icon large target="_blank" v-on="on">
+                      <v-icon large>code</v-icon>
+                    </v-btn>
+                  </template>
                   <span>Source</span>
                 </v-tooltip>
                 <v-tooltip right>
-                  <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/wyYVVj" target="_blank">
-                    <v-icon large>mdi-codepen</v-icon>
-                  </v-btn>
+                  <template v-slot:activator="{ on }">
+                    <v-btn icon large href="https://codepen.io/johnjleider/pen/wyYVVj" target="_blank" v-on="on">
+                      <v-icon large>mdi-codepen</v-icon>
+                    </v-btn>
+                  </template>
                   <span>Codepen</span>
                 </v-tooltip>
               </v-toolbar>
diff --git a/packages/docs/src/examples/layouts/complex.vue b/packages/docs/src/examples/layouts/complex.vue
index 7e36eb52d9a..e5f98f295ce 100644
--- a/packages/docs/src/examples/layouts/complex.vue
+++ b/packages/docs/src/examples/layouts/complex.vue
@@ -56,21 +56,19 @@
         <v-layout justify-center align-center>
           <v-flex shrink>
             <v-tooltip right>
-              <v-btn
-                slot="activator"
-                :href="source"
-                icon
-                large
-                target="_blank"
-              >
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/KQrPKJ" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/KQrPKJ" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/layouts/dark.vue b/packages/docs/src/examples/layouts/dark.vue
index 9efce611056..dd9280d7557 100644
--- a/packages/docs/src/examples/layouts/dark.vue
+++ b/packages/docs/src/examples/layouts/dark.vue
@@ -34,21 +34,19 @@
         <v-layout justify-center align-center>
           <v-flex shrink>
             <v-tooltip right>
-              <v-btn
-                slot="activator"
-                :href="source"
-                icon
-                large
-                target="_blank"
-              >
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/qxQWda" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/qxQWda" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/layouts/googleContacts.vue b/packages/docs/src/examples/layouts/googleContacts.vue
index ccfc6ec0806..19332865f1f 100644
--- a/packages/docs/src/examples/layouts/googleContacts.vue
+++ b/packages/docs/src/examples/layouts/googleContacts.vue
@@ -30,13 +30,15 @@
             :prepend-icon="item.model ? item.icon : item['icon-alt']"
             append-icon=""
           >
-            <v-list-tile slot="activator">
-              <v-list-tile-content>
-                <v-list-tile-title>
-                  {{ item.text }}
-                </v-list-tile-title>
-              </v-list-tile-content>
-            </v-list-tile>
+            <template v-slot:activator>
+              <v-list-tile>
+                <v-list-tile-content>
+                  <v-list-tile-title>
+                    {{ item.text }}
+                  </v-list-tile-title>
+                </v-list-tile-content>
+              </v-list-tile>
+            </template>
             <v-list-tile
               v-for="(child, i) in item.children"
               :key="i"
@@ -104,21 +106,19 @@
       <v-container fluid fill-height>
         <v-layout justify-center align-center>
           <v-tooltip right>
-            <v-btn
-              slot="activator"
-              :href="source"
-              icon
-              large
-              target="_blank"
-            >
-              <v-icon large>code</v-icon>
-            </v-btn>
+            <template v-slot:activator="{ on }">
+              <v-btn :href="source" icon large target="_blank" v-on="on">
+                <v-icon large>code</v-icon>
+              </v-btn>
+            </template>
             <span>Source</span>
           </v-tooltip>
           <v-tooltip right>
-            <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/EQOYVV" target="_blank">
-              <v-icon large>mdi-codepen</v-icon>
-            </v-btn>
+            <template v-slot:activator="{ on }">
+              <v-btn icon large href="https://codepen.io/johnjleider/pen/EQOYVV" target="_blank" v-on="on">
+                <v-icon large>mdi-codepen</v-icon>
+              </v-btn>
+            </template>
             <span>Codepen</span>
           </v-tooltip>
         </v-layout>
diff --git a/packages/docs/src/examples/layouts/googleKeep.vue b/packages/docs/src/examples/layouts/googleKeep.vue
index b57e57ce13d..765a02b14e5 100644
--- a/packages/docs/src/examples/layouts/googleKeep.vue
+++ b/packages/docs/src/examples/layouts/googleKeep.vue
@@ -67,21 +67,19 @@
         <v-layout justify-center align-center>
           <v-flex shrink>
             <v-tooltip right>
-              <v-btn
-                slot="activator"
-                :href="source"
-                icon
-                large
-                target="_blank"
-              >
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/jZQNbd" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/jZQNbd" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/layouts/googleYoutube.vue b/packages/docs/src/examples/layouts/googleYoutube.vue
index 243e7c3df47..ee6d511fc36 100644
--- a/packages/docs/src/examples/layouts/googleYoutube.vue
+++ b/packages/docs/src/examples/layouts/googleYoutube.vue
@@ -72,21 +72,19 @@
         <v-layout justify-center align-center>
           <v-flex shrink>
             <v-tooltip right>
-              <v-btn
-                slot="activator"
-                :href="source"
-                icon
-                large
-                target="_blank"
-              >
-                <v-icon large>code</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn :href="source" icon large target="_blank" v-on="on">
+                  <v-icon large>code</v-icon>
+                </v-btn>
+              </template>
               <span>Source</span>
             </v-tooltip>
             <v-tooltip right>
-              <v-btn slot="activator" icon large href="https://codepen.io/johnjleider/pen/YeRKwQ" target="_blank">
-                <v-icon large>mdi-codepen</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn icon large href="https://codepen.io/johnjleider/pen/YeRKwQ" target="_blank" v-on="on">
+                  <v-icon large>mdi-codepen</v-icon>
+                </v-btn>
+              </template>
               <span>Codepen</span>
             </v-tooltip>
           </v-flex>
diff --git a/packages/docs/src/examples/lists/expansionLists.vue b/packages/docs/src/examples/lists/expansionLists.vue
index 7cb51e2246d..1b4321aeea7 100644
--- a/packages/docs/src/examples/lists/expansionLists.vue
+++ b/packages/docs/src/examples/lists/expansionLists.vue
@@ -22,11 +22,13 @@
             :prepend-icon="item.action"
             no-action
           >
-            <v-list-tile slot="activator">
-              <v-list-tile-content>
-                <v-list-tile-title>{{ item.title }}</v-list-tile-title>
-              </v-list-tile-content>
-            </v-list-tile>
+            <template v-slot:activator>
+              <v-list-tile>
+                <v-list-tile-content>
+                  <v-list-tile-title>{{ item.title }}</v-list-tile-title>
+                </v-list-tile-content>
+              </v-list-tile>
+            </template>
 
             <v-list-tile
               v-for="subItem in item.items"
diff --git a/packages/docs/src/examples/menus/absolute.vue b/packages/docs/src/examples/menus/absolute.vue
index 5df823b4de6..7cd10a0fe38 100644
--- a/packages/docs/src/examples/menus/absolute.vue
+++ b/packages/docs/src/examples/menus/absolute.vue
@@ -9,13 +9,15 @@
       offset-y
       style="max-width: 600px"
     >
-      <v-card
-        slot="activator"
-        class="portrait"
-        img="https://cdn.vuetifyjs.com/images/cards/girl.jpg"
-        height="300"
-        width="600"
-      ></v-card>
+      <template v-slot:activator="{ on }">
+        <v-card
+          class="portrait"
+          img="https://cdn.vuetifyjs.com/images/cards/girl.jpg"
+          height="300"
+          width="600"
+          v-on="on"
+        ></v-card>
+      </template>
 
       <v-list>
         <v-list-tile
diff --git a/packages/docs/src/examples/menus/customTransition.vue b/packages/docs/src/examples/menus/customTransition.vue
index e3c5e7238b4..73e64f56476 100644
--- a/packages/docs/src/examples/menus/customTransition.vue
+++ b/packages/docs/src/examples/menus/customTransition.vue
@@ -5,13 +5,15 @@
       origin="center center"
       transition="scale-transition"
     >
-      <v-btn
-        slot="activator"
-        color="primary"
-        dark
-      >
-        Scale Transition
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          color="primary"
+          dark
+          v-on="on"
+        >
+          Scale Transition
+        </v-btn>
+      </template>
 
       <v-list>
         <v-list-tile
@@ -29,14 +31,16 @@
       bottom
       right
     >
-      <v-btn
-        slot="activator"
-        class="deep-orange"
-        color="primary"
-        dark
-      >
-        Slide X Transition
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="deep-orange"
+          color="primary"
+          dark
+          v-on="on"
+        >
+          Slide X Transition
+        </v-btn>
+      </template>
 
       <v-list>
         <v-list-tile
@@ -53,14 +57,16 @@
       transition="slide-y-transition"
       bottom
     >
-      <v-btn
-        slot="activator"
-        class="purple"
-        color="primary"
-        dark
-      >
-        Slide Y Transition
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          class="purple"
+          color="primary"
+          dark
+          v-on="on"
+        >
+          Slide Y Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile
           v-for="(item, i) in items"
diff --git a/packages/docs/src/examples/menus/hover.vue b/packages/docs/src/examples/menus/hover.vue
index ecf128e538a..bac2356a169 100644
--- a/packages/docs/src/examples/menus/hover.vue
+++ b/packages/docs/src/examples/menus/hover.vue
@@ -1,13 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu open-on-hover top offset-y>
-      <v-btn
-        slot="activator"
-        color="primary"
-        dark
-      >
-        Dropdown
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          color="primary"
+          dark
+          v-on="on"
+        >
+          Dropdown
+        </v-btn>
+      </template>
 
       <v-list>
         <v-list-tile
diff --git a/packages/docs/src/examples/menus/menus.vue b/packages/docs/src/examples/menus/menus.vue
index 3ea5cd28643..c220a832af7 100644
--- a/packages/docs/src/examples/menus/menus.vue
+++ b/packages/docs/src/examples/menus/menus.vue
@@ -8,13 +8,15 @@
           <v-spacer></v-spacer>
 
           <v-menu bottom left>
-            <v-btn
-              slot="activator"
-              dark
-              icon
-            >
-              <v-icon>more_vert</v-icon>
-            </v-btn>
+            <template v-slot:activator="{ on }">
+              <v-btn
+                dark
+                icon
+                v-on="on"
+              >
+                <v-icon>more_vert</v-icon>
+              </v-btn>
+            </template>
 
             <v-list>
               <v-list-tile
diff --git a/packages/docs/src/examples/menus/popover.vue b/packages/docs/src/examples/menus/popover.vue
index af3566add7b..ff65a685982 100644
--- a/packages/docs/src/examples/menus/popover.vue
+++ b/packages/docs/src/examples/menus/popover.vue
@@ -6,13 +6,15 @@
       :nudge-width="200"
       offset-x
     >
-      <v-btn
-        slot="activator"
-        color="indigo"
-        dark
-      >
-        Menu as Popover
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          color="indigo"
+          dark
+          v-on="on"
+        >
+          Menu as Popover
+        </v-btn>
+      </template>
 
       <v-card>
         <v-list>
diff --git a/packages/docs/src/examples/menus/usage.vue b/packages/docs/src/examples/menus/usage.vue
index 6f3abeacce2..b937c152b39 100644
--- a/packages/docs/src/examples/menus/usage.vue
+++ b/packages/docs/src/examples/menus/usage.vue
@@ -1,13 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu offset-y>
-      <v-btn
-        slot="activator"
-        color="primary"
-        dark
-      >
-        Dropdown
-      </v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          color="primary"
+          dark
+          v-on="on"
+        >
+          Dropdown
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile
           v-for="(item, index) in items"
diff --git a/packages/docs/src/examples/navigation-drawers/nested.vue b/packages/docs/src/examples/navigation-drawers/nested.vue
index 8861c7e805e..d71d78a31cd 100644
--- a/packages/docs/src/examples/navigation-drawers/nested.vue
+++ b/packages/docs/src/examples/navigation-drawers/nested.vue
@@ -15,18 +15,21 @@
         prepend-icon="account_circle"
         value="true"
       >
-        <v-list-tile slot="activator">
-          <v-list-tile-title>Users</v-list-tile-title>
-        </v-list-tile>
-
+        <template v-slot:activator>
+          <v-list-tile>
+            <v-list-tile-title>Users</v-list-tile-title>
+          </v-list-tile>
+        </template>
         <v-list-group
           no-action
           sub-group
           value="true"
         >
-          <v-list-tile slot="activator">
-            <v-list-tile-title>Admin</v-list-tile-title>
-          </v-list-tile>
+          <template v-slot:activator>
+            <v-list-tile>
+              <v-list-tile-title>Admin</v-list-tile-title>
+            </v-list-tile>
+          </template>
 
           <v-list-tile
             v-for="(admin, i) in admins"
@@ -44,10 +47,11 @@
           sub-group
           no-action
         >
-          <v-list-tile slot="activator">
-            <v-list-tile-title>Actions</v-list-tile-title>
-          </v-list-tile>
-
+          <template v-slot:activator>
+            <v-list-tile>
+              <v-list-tile-title>Actions</v-list-tile-title>
+            </v-list-tile>
+          </template>
           <v-list-tile
             v-for="(crud, i) in cruds"
             :key="i"
diff --git a/packages/docs/src/examples/ratings/advanced.vue b/packages/docs/src/examples/ratings/advanced.vue
index 4fd61423d61..432e6d1ca9f 100644
--- a/packages/docs/src/examples/ratings/advanced.vue
+++ b/packages/docs/src/examples/ratings/advanced.vue
@@ -51,9 +51,11 @@
         v-model="dialog"
         width="400"
       >
-        <v-icon slot="activator">
-          mdi-share-variant
-        </v-icon>
+        <template v-slot:activator="{ on }">
+          <v-icon v-on="on">
+            mdi-share-variant
+          </v-icon>
+        </template>
         <v-card>
           <v-card-title>
             <span class="title font-weight-bold">Share</span>
@@ -106,12 +108,12 @@
         length="10"
         readonly
       >
-        <v-icon
-          slot="item"
-          slot-scope="props"
-          :color="props.isFilled ? 'purple darken-4' : ''"
-          v-text="`mdi-numeric-${props.index}-box`"
-        ></v-icon>
+        <template v-slot:item="props">
+          <v-icon
+            :color="props.isFilled ? 'purple darken-4' : ''"
+            v-text="`mdi-numeric-${props.index}-box`"
+          ></v-icon>
+        </template>
       </v-rating>
     </v-card-actions>
     <div class="pa-3 pt-0 caption">
diff --git a/packages/docs/src/examples/ratings/slots.vue b/packages/docs/src/examples/ratings/slots.vue
index b8efbaafaa2..eb0d41faba0 100644
--- a/packages/docs/src/examples/ratings/slots.vue
+++ b/packages/docs/src/examples/ratings/slots.vue
@@ -1,15 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-rating v-model="rating">
-      <v-icon
-        slot="item"
-        slot-scope="props"
-        :color="props.isFilled ? genColor(props.index) : 'grey lighten-1'"
-        large
-        @click="props.click"
-      >
-        {{ props.isFilled ? 'mdi-star-circle' : 'mdi-circle-outline' }}
-      </v-icon>
+      <template v-slot:item="props">
+        <v-icon
+          :color="props.isFilled ? genColor(props.index) : 'grey lighten-1'"
+          large
+          @click="props.click"
+        >
+          {{ props.isFilled ? 'mdi-star-circle' : 'mdi-circle-outline' }}
+        </v-icon>
+      </template>
     </v-rating>
   </div>
 </template>
diff --git a/packages/docs/src/examples/selection-controls/labelSlot.vue b/packages/docs/src/examples/selection-controls/labelSlot.vue
index 7433338c5d9..565f8a3558b 100644
--- a/packages/docs/src/examples/selection-controls/labelSlot.vue
+++ b/packages/docs/src/examples/selection-controls/labelSlot.vue
@@ -1,28 +1,45 @@
 <template>
   <v-container fluid>
     <v-checkbox v-model="checkbox">
-      <div slot="label">
-        I agree that
-        <v-tooltip bottom>
-          <a slot="activator" target="_blank" href="http://vuetifyjs.com" @click.stop>Vuetify</a>
-          Opens in new window
-        </v-tooltip>
-        is awesome
-      </div>
+      <template v-slot:label>
+        <div>
+          I agree that
+          <v-tooltip bottom>
+            <template v-slot:activator="{ on }">
+              <a
+                target="_blank"
+                href="http://vuetifyjs.com"
+                @click.stop
+                v-on="on"
+              >
+                Vuetify
+              </a>
+            </template>
+            Opens in new window
+          </v-tooltip>
+          is awesome
+        </div>
+      </template>
     </v-checkbox>
 
     <v-radio-group v-model="radios">
-      <div slot="label">Your favourite <strong>search engine</strong></div>
+      <template v-slot:label>
+        <div>Your favourite <strong>search engine</strong></div>
+      </template>
       <v-radio value="Google">
-        <div slot="label">Of course it's <strong class="success--text">Google</strong></div>
+        <template v-slot:label>
+          <div>Of course it's <strong class="success--text">Google</strong></div>
+        </template>
       </v-radio>
       <v-radio value="Duckduckgo">
-        <div slot="label">Definitely <strong class="primary--text">Duckduckgo</strong></div>
+        <template v-slot:label>
+          <div>Definitely <strong class="primary--text">Duckduckgo</strong></div>
+        </template>
       </v-radio>
     </v-radio-group>
 
     <v-switch v-model="switchMe">
-      <template slot="label">
+      <template v-slot:label>
         Turn on the progress: <v-progress-circular :indeterminate="switchMe" :value="0" size="24" class="ml-2"></v-progress-circular>
       </template>
     </v-switch>
diff --git a/packages/docs/src/examples/selects/selectionAppearance.vue b/packages/docs/src/examples/selects/selectionAppearance.vue
index 2ef2fbdceca..0847e5e855a 100644
--- a/packages/docs/src/examples/selects/selectionAppearance.vue
+++ b/packages/docs/src/examples/selects/selectionAppearance.vue
@@ -5,10 +5,7 @@
     label="Select Item"
     multiple
   >
-    <template
-      slot="selection"
-      slot-scope="{ item, index }"
-    >
+    <template v-slot:selection="{ item, index }">
       <v-chip v-if="index === 0">
         <span>{{ item }}</span>
       </v-chip>
diff --git a/packages/docs/src/examples/selects/slots.vue b/packages/docs/src/examples/selects/slots.vue
index fae75563a56..0c82ec328ea 100644
--- a/packages/docs/src/examples/selects/slots.vue
+++ b/packages/docs/src/examples/selects/slots.vue
@@ -5,50 +5,48 @@
     label="Favorite Fruits"
     multiple
   >
-    <v-list-tile
-      slot="prepend-item"
-      ripple
-      @click="toggle"
-    >
-      <v-list-tile-action>
-        <v-icon :color="selectedFruits.length > 0 ? 'indigo darken-4' : ''">{{ icon }}</v-icon>
-      </v-list-tile-action>
-      <v-list-tile-title>Select All</v-list-tile-title>
-    </v-list-tile>
-    <v-divider
-      slot="prepend-item"
-      class="mt-2"
-    ></v-divider>
-    <v-divider
-      slot="append-item"
-      class="mb-2"
-    ></v-divider>
-    <v-list-tile
-      slot="append-item"
-      disabled
-    >
-      <v-list-tile-avatar color="grey lighten-3">
-        <v-icon>mdi-food-apple</v-icon>
-      </v-list-tile-avatar>
+    <template v-slot:prepend-item>
+      <v-list-tile
+        ripple
+        @click="toggle"
+      >
+        <v-list-tile-action>
+          <v-icon :color="selectedFruits.length > 0 ? 'indigo darken-4' : ''">{{ icon }}</v-icon>
+        </v-list-tile-action>
+        <v-list-tile-title>Select All</v-list-tile-title>
+      </v-list-tile>
+    </template>
+    <template v-slot:prepend-item>
+      <v-divider class="mt-2"></v-divider>
+    </template>
+    <template v-slot:append-item>
+      <v-divider class="mb-2"></v-divider>
+    </template>
+    <template v-slot:append-item>
+      <v-list-tile disabled>
+        <v-list-tile-avatar color="grey lighten-3">
+          <v-icon>mdi-food-apple</v-icon>
+        </v-list-tile-avatar>
 
-      <v-list-tile-content v-if="likesAllFruit">
-        <v-list-tile-title>Holy smokes, someone call the fruit police!</v-list-tile-title>
-      </v-list-tile-content>
+        <v-list-tile-content v-if="likesAllFruit">
+          <v-list-tile-title>Holy smokes, someone call the fruit police!</v-list-tile-title>
+        </v-list-tile-content>
 
-      <v-list-tile-content v-else-if="likesSomeFruit">
-        <v-list-tile-title>Fruit Count</v-list-tile-title>
-        <v-list-tile-sub-title>{{ selectedFruits.length }}</v-list-tile-sub-title>
-      </v-list-tile-content>
+        <v-list-tile-content v-else-if="likesSomeFruit">
+          <v-list-tile-title>Fruit Count</v-list-tile-title>
+          <v-list-tile-sub-title>{{ selectedFruits.length }}</v-list-tile-sub-title>
+        </v-list-tile-content>
 
-      <v-list-tile-content v-else>
-        <v-list-tile-title>
-          How could you not like fruit?
-        </v-list-tile-title>
-        <v-list-tile-sub-title>
-          Go ahead, make a selection above!
-        </v-list-tile-sub-title>
-      </v-list-tile-content>
-    </v-list-tile>
+        <v-list-tile-content v-else>
+          <v-list-tile-title>
+            How could you not like fruit?
+          </v-list-tile-title>
+          <v-list-tile-sub-title>
+            Go ahead, make a selection above!
+          </v-list-tile-sub-title>
+        </v-list-tile-content>
+      </v-list-tile>
+    </template>
   </v-select>
 </template>
 
diff --git a/packages/docs/src/examples/sliders/customThumb.vue b/packages/docs/src/examples/sliders/customThumb.vue
index cf9cbfe0ded..246d089a0df 100644
--- a/packages/docs/src/examples/sliders/customThumb.vue
+++ b/packages/docs/src/examples/sliders/customThumb.vue
@@ -11,10 +11,7 @@
         thumb-size="64"
         ticks="always"
       >
-        <template
-          slot="thumb-label"
-          slot-scope="props"
-        >
+        <template v-slot:thumb-label="props">
           <span>
             {{ season(props.value) }}
           </span>
diff --git a/packages/docs/src/examples/sliders/metronome.vue b/packages/docs/src/examples/sliders/metronome.vue
index 72ad2532365..a51bb6e5e45 100644
--- a/packages/docs/src/examples/sliders/metronome.vue
+++ b/packages/docs/src/examples/sliders/metronome.vue
@@ -61,21 +61,23 @@
         min="40"
         max="218"
       >
-        <v-icon
-          slot="prepend"
-          :color="color"
-          @click="decrement"
-        >
-          mdi-minus
-        </v-icon>
+        <template v-slot:prepend>
+          <v-icon
+            :color="color"
+            @click="decrement"
+          >
+            mdi-minus
+          </v-icon>
+        </template>
 
-        <v-icon
-          slot="append"
-          :color="color"
-          @click="increment"
-        >
-          mdi-plus
-        </v-icon>
+        <template v-slot:append>
+          <v-icon
+            :color="color"
+            @click="increment"
+          >
+            mdi-plus
+          </v-icon>
+        </template>
       </v-slider>
     </v-card-text>
   </v-card>
diff --git a/packages/docs/src/examples/spacing/playground.vue b/packages/docs/src/examples/spacing/playground.vue
index 3e9421b993d..f4951079745 100644
--- a/packages/docs/src/examples/spacing/playground.vue
+++ b/packages/docs/src/examples/spacing/playground.vue
@@ -21,8 +21,10 @@
           class="pr-2"
           v-model="paddingDirection"
         )
-          strong(slot="prepend").primary--text p
-          div(slot="append-outer") -
+          template(v-slot:prepend)
+            strong().primary--text p
+          template(v-slot:append-outer)
+            div() -
 
         v-select(
           :items="sizes.slice(1)"
@@ -40,8 +42,10 @@
           class="pr-2"
           v-model="marginDirection"
         )
-          strong(slot="prepend").primary--text m
-          div(slot="append-outer") -
+          template(v-slot:prepend)
+            strong().primary--text m
+          template(v-slot:append-outer)
+            div() -
 
         v-select(
           :items="sizes"
diff --git a/packages/docs/src/examples/sparklines/salesCard.vue b/packages/docs/src/examples/sparklines/salesCard.vue
index 22453a9a6cb..6dc88b55cd6 100644
--- a/packages/docs/src/examples/sparklines/salesCard.vue
+++ b/packages/docs/src/examples/sparklines/salesCard.vue
@@ -15,10 +15,7 @@
           stroke-linecap="round"
           smooth
         >
-          <template
-            slot="label"
-            slot-scope="item"
-          >
+          <template v-slot:label="item">
             ${{ item.value }}
           </template>
         </v-sparkline>
diff --git a/packages/docs/src/examples/tabs/alignWithTitle.vue b/packages/docs/src/examples/tabs/alignWithTitle.vue
index 63ccfaabb48..3304ba7bef6 100644
--- a/packages/docs/src/examples/tabs/alignWithTitle.vue
+++ b/packages/docs/src/examples/tabs/alignWithTitle.vue
@@ -15,18 +15,19 @@
         <v-icon>more_vert</v-icon>
       </v-btn>
 
-      <v-tabs
-        slot="extension"
-        v-model="tab"
-        color="cyan"
-        align-with-title
-      >
-        <v-tabs-slider color="yellow"></v-tabs-slider>
-
-        <v-tab v-for="item in items" :key="item">
-          {{ item }}
-        </v-tab>
-      </v-tabs>
+      <template v-slot:extension>
+        <v-tabs
+          v-model="tab"
+          color="cyan"
+          align-with-title
+        >
+          <v-tabs-slider color="yellow"></v-tabs-slider>
+
+          <v-tab v-for="item in items" :key="item">
+            {{ item }}
+          </v-tab>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="tab">
diff --git a/packages/docs/src/examples/tabs/content.vue b/packages/docs/src/examples/tabs/content.vue
index df90be219bc..4f3fafdf481 100644
--- a/packages/docs/src/examples/tabs/content.vue
+++ b/packages/docs/src/examples/tabs/content.vue
@@ -19,21 +19,22 @@
         <v-icon>more_vert</v-icon>
       </v-btn>
 
-      <v-tabs
-        slot="extension"
-        v-model="model"
-        centered
-        color="cyan"
-        slider-color="yellow"
-      >
-        <v-tab
-          v-for="i in 3"
-          :key="i"
-          :href="`#tab-${i}`"
+      <template v-slot:extension>
+        <v-tabs
+          v-model="model"
+          centered
+          color="cyan"
+          slider-color="yellow"
         >
-          Item {{ i }}
-        </v-tab>
-      </v-tabs>
+          <v-tab
+            v-for="i in 3"
+            :key="i"
+            :href="`#tab-${i}`"
+          >
+            Item {{ i }}
+          </v-tab>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="model">
diff --git a/packages/docs/src/examples/tabs/desktop.vue b/packages/docs/src/examples/tabs/desktop.vue
index 6e06375191c..194b0b3e8ac 100644
--- a/packages/docs/src/examples/tabs/desktop.vue
+++ b/packages/docs/src/examples/tabs/desktop.vue
@@ -15,25 +15,26 @@
         <v-icon>more_vert</v-icon>
       </v-btn>
 
-      <v-tabs
-        slot="extension"
-        v-model="tabs"
-        fixed-tabs
-        color="transparent"
-      >
-        <v-tabs-slider></v-tabs-slider>
-        <v-tab href="#mobile-tabs-5-1" class="primary--text">
-          <v-icon>phone</v-icon>
-        </v-tab>
-
-        <v-tab href="#mobile-tabs-5-2" class="primary--text">
-          <v-icon>favorite</v-icon>
-        </v-tab>
-
-        <v-tab href="#mobile-tabs-5-3" class="primary--text">
-          <v-icon>account_box</v-icon>
-        </v-tab>
-      </v-tabs>
+      <template v-slot:extension>
+        <v-tabs
+          v-model="tabs"
+          fixed-tabs
+          color="transparent"
+        >
+          <v-tabs-slider></v-tabs-slider>
+          <v-tab href="#mobile-tabs-5-1" class="primary--text">
+            <v-icon>phone</v-icon>
+          </v-tab>
+
+          <v-tab href="#mobile-tabs-5-2" class="primary--text">
+            <v-icon>favorite</v-icon>
+          </v-tab>
+
+          <v-tab href="#mobile-tabs-5-3" class="primary--text">
+            <v-icon>account_box</v-icon>
+          </v-tab>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="tabs" class="white elevation-1">
diff --git a/packages/docs/src/examples/tabs/grow.vue b/packages/docs/src/examples/tabs/grow.vue
index 09d570700f8..b39db8a74c7 100644
--- a/packages/docs/src/examples/tabs/grow.vue
+++ b/packages/docs/src/examples/tabs/grow.vue
@@ -19,21 +19,22 @@
         <v-icon>more_vert</v-icon>
       </v-btn>
 
-      <v-tabs
-        slot="extension"
-        v-model="tab"
-        color="cyan"
-        grow
-      >
-        <v-tabs-slider color="yellow"></v-tabs-slider>
-
-        <v-tab
-          v-for="item in items"
-          :key="item"
+      <template v-slot:extension>
+        <v-tabs
+          v-model="tab"
+          color="cyan"
+          grow
         >
-          {{ item }}
-        </v-tab>
-      </v-tabs>
+          <v-tabs-slider color="yellow"></v-tabs-slider>
+
+          <v-tab
+            v-for="item in items"
+            :key="item"
+          >
+            {{ item }}
+          </v-tab>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="tab">
diff --git a/packages/docs/src/examples/tabs/overflowToMenu.vue b/packages/docs/src/examples/tabs/overflowToMenu.vue
index ca95706bffd..2b76e8dfbe8 100644
--- a/packages/docs/src/examples/tabs/overflowToMenu.vue
+++ b/packages/docs/src/examples/tabs/overflowToMenu.vue
@@ -19,43 +19,45 @@
         <v-icon>more_vert</v-icon>
       </v-btn>
 
-      <v-tabs
-        slot="extension"
-        v-model="currentItem"
-        color="transparent"
-        fixed-tabs
-        slider-color="yellow"
-      >
-        <v-tab
-          v-for="item in items"
-          :key="item"
-          :href="'#tab-' + item"
-        >
-          {{ item }}
-        </v-tab>
-
-        <v-menu
-          v-if="more.length"
-          bottom
-          class="v-tabs__div"
-          left
+      <template v-slot:extension>
+        <v-tabs
+          v-model="currentItem"
+          color="transparent"
+          fixed-tabs
+          slider-color="yellow"
         >
-          <a slot="activator" class="v-tabs__item">
-            more
-            <v-icon>arrow_drop_down</v-icon>
-          </a>
+          <v-tab
+            v-for="item in items"
+            :key="item"
+            :href="'#tab-' + item"
+          >
+            {{ item }}
+          </v-tab>
 
-          <v-list class="grey lighten-3">
-            <v-list-tile
-              v-for="item in more"
-              :key="item"
-              @click="addItem(item)"
-            >
-              {{ item }}
-            </v-list-tile>
-          </v-list>
-        </v-menu>
-      </v-tabs>
+          <v-menu
+            v-if="more.length"
+            bottom
+            class="v-tabs__div"
+            left
+          >
+            <template v-slot:activator="{ on }">
+              <a class="v-tabs__item" v-on="on">
+                more
+                <v-icon>arrow_drop_down</v-icon>
+              </a>
+            </template>
+            <v-list class="grey lighten-3">
+              <v-list-tile
+                v-for="item in more"
+                :key="item"
+                @click="addItem(item)"
+              >
+                {{ item }}
+              </v-list-tile>
+            </v-list>
+          </v-menu>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="currentItem">
diff --git a/packages/docs/src/examples/tabs/search.vue b/packages/docs/src/examples/tabs/search.vue
index 9ab07170673..3e5187e0f94 100644
--- a/packages/docs/src/examples/tabs/search.vue
+++ b/packages/docs/src/examples/tabs/search.vue
@@ -14,20 +14,21 @@
         solo-inverted
       ></v-text-field>
 
-      <v-tabs
-        slot="extension"
-        v-model="tabs"
-        centered
-        color="transparent"
-        slider-color="white"
-      >
-        <v-tab
-          v-for="n in 3"
-          :key="n"
+      <template v-slot:extension>
+        <v-tabs
+          v-model="tabs"
+          centered
+          color="transparent"
+          slider-color="white"
         >
-          Item {{ n }}
-        </v-tab>
-      </v-tabs>
+          <v-tab
+            v-for="n in 3"
+            :key="n"
+          >
+            Item {{ n }}
+          </v-tab>
+        </v-tabs>
+      </template>
     </v-toolbar>
 
     <v-tabs-items v-model="tabs">
diff --git a/packages/docs/src/examples/text-fields/customColors.vue b/packages/docs/src/examples/text-fields/customColors.vue
index 54bf894d1d6..3f6298b6ce2 100644
--- a/packages/docs/src/examples/text-fields/customColors.vue
+++ b/packages/docs/src/examples/text-fields/customColors.vue
@@ -36,9 +36,11 @@
               v-model="form.bio"
               color="teal"
             >
-              <div slot="label">
-                Bio <small>(optional)</small>
-              </div>
+              <template v-slot:label>
+                <div>
+                  Bio <small>(optional)</small>
+                </div>
+              </template>
             </v-textarea>
           </v-flex>
           <v-flex xs12 sm6>
@@ -68,12 +70,14 @@
               v-model="form.terms"
               color="green"
             >
-              <div slot="label" @click.stop="">
-                Do you accept the
-                <a href="javascript:;" @click.stop="terms = true">terms</a>
-                and
-                <a href="javascript:;" @click.stop="conditions = true">conditions?</a>
-              </div>
+              <template v-slot:label>
+                <div @click.stop="">
+                  Do you accept the
+                  <a href="javascript:;" @click.stop="terms = true">terms</a>
+                  and
+                  <a href="javascript:;" @click.stop="conditions = true">conditions?</a>
+                </div>
+              </template>
             </v-checkbox>
           </v-flex>
         </v-layout>
diff --git a/packages/docs/src/examples/text-fields/customValidation.vue b/packages/docs/src/examples/text-fields/customValidation.vue
index b37bd804ead..abbd5c0681b 100644
--- a/packages/docs/src/examples/text-fields/customValidation.vue
+++ b/packages/docs/src/examples/text-fields/customValidation.vue
@@ -68,14 +68,16 @@
               v-if="formHasErrors"
               left
             >
-              <v-btn
-                slot="activator"
-                icon
-                class="my-0"
-                @click="resetForm"
-              >
-                <v-icon>refresh</v-icon>
-              </v-btn>
+              <template v-slot:activator="{ on }">
+                <v-btn
+                  icon
+                  class="my-0"
+                  @click="resetForm"
+                  v-on="on"
+                >
+                  <v-icon>refresh</v-icon>
+                </v-btn>
+              </template>
               <span>Refresh form</span>
             </v-tooltip>
           </v-slide-x-reverse-transition>
diff --git a/packages/docs/src/examples/text-fields/iconSlots.vue b/packages/docs/src/examples/text-fields/iconSlots.vue
index 04dc087199b..4d83160ec43 100644
--- a/packages/docs/src/examples/text-fields/iconSlots.vue
+++ b/packages/docs/src/examples/text-fields/iconSlots.vue
@@ -10,42 +10,45 @@
             label="Message"
             type="text"
           >
-            <v-tooltip
-              slot="prepend"
-              bottom
-            >
-              <v-icon slot="activator">mdi-help-circle-outline</v-icon>
-              I'm a tooltip
-            </v-tooltip>
-
-            <v-fade-transition
-              slot="append"
-              leave-absolute
-            >
-              <v-progress-circular
-                v-if="loading"
-                size="24"
-                color="info"
-                indeterminate
-              ></v-progress-circular>
-              <img v-else width="24" height="24" src="https://cdn.vuetifyjs.com/images/logos/v-alt.svg" alt="">
-            </v-fade-transition>
-
-            <v-menu
-              slot="append-outer"
-              style="top: -12px"
-              offset-y
-            >
-              <v-btn slot="activator">
-                <v-icon left>menu</v-icon>
-                Menu
-              </v-btn>
-              <v-card>
-                <v-card-text class="pa-4">
-                  <v-btn large flat color="primary" @click="clickMe"><v-icon left>mdi-target</v-icon>Click me</v-btn>
-                </v-card-text>
-              </v-card>
-            </v-menu>
+            <template v-slot:prepend>
+              <v-tooltip
+                bottom
+              >
+                <template v-slot:activator="{ on }">
+                  <v-icon v-on="on">mdi-help-circle-outline</v-icon>
+                </template>
+                I'm a tooltip
+              </v-tooltip>
+            </template>
+            <template v-slot:append>
+              <v-fade-transition leave-absolute>
+                <v-progress-circular
+                  v-if="loading"
+                  size="24"
+                  color="info"
+                  indeterminate
+                ></v-progress-circular>
+                <img v-else width="24" height="24" src="https://cdn.vuetifyjs.com/images/logos/v-alt.svg" alt="">
+              </v-fade-transition>
+            </template>
+            <template v-slot:append-outer>
+              <v-menu
+                style="top: -12px"
+                offset-y
+              >
+                <template v-slot:activator="{ on }">
+                  <v-btn v-on="on">
+                    <v-icon left>menu</v-icon>
+                    Menu
+                  </v-btn>
+                </template>
+                <v-card>
+                  <v-card-text class="pa-4">
+                    <v-btn large flat color="primary" @click="clickMe"><v-icon left>mdi-target</v-icon>Click me</v-btn>
+                  </v-card-text>
+                </v-card>
+              </v-menu>
+            </template>
           </v-text-field>
         </v-flex>
 
diff --git a/packages/docs/src/examples/text-fields/labelSlot.vue b/packages/docs/src/examples/text-fields/labelSlot.vue
index 23cbe4facc8..4fc2bf5735e 100644
--- a/packages/docs/src/examples/text-fields/labelSlot.vue
+++ b/packages/docs/src/examples/text-fields/labelSlot.vue
@@ -2,7 +2,7 @@
   <v-form>
     <v-container>
       <v-text-field>
-        <template slot="label">
+        <template v-slot:label>
           What about <strong>icon</strong> here? <v-icon style="vertical-align: middle">find_in_page</v-icon>
         </template>
       </v-text-field>
diff --git a/packages/docs/src/examples/text-fields/progressBar.vue b/packages/docs/src/examples/text-fields/progressBar.vue
index 8907ab21f31..6b1771d13e8 100644
--- a/packages/docs/src/examples/text-fields/progressBar.vue
+++ b/packages/docs/src/examples/text-fields/progressBar.vue
@@ -8,13 +8,14 @@
       placeholder="Start typing..."
       loading
     >
-      <v-progress-linear
-        v-if="custom"
-        slot="progress"
-        :value="progress"
-        :color="color"
-        height="7"
-      ></v-progress-linear>
+      <template v-slot:progress>
+        <v-progress-linear
+          v-if="custom"
+          :value="progress"
+          :color="color"
+          height="7"
+        ></v-progress-linear>
+      </template>
     </v-text-field>
   </v-container>
 </template>
diff --git a/packages/docs/src/examples/textarea/signupBox.vue b/packages/docs/src/examples/textarea/signupBox.vue
index 65b823d81da..ddd1185e705 100644
--- a/packages/docs/src/examples/textarea/signupBox.vue
+++ b/packages/docs/src/examples/textarea/signupBox.vue
@@ -79,7 +79,7 @@
         :rules="[rules.required]"
         color="deep-purple"
       >
-        <template slot="label">
+        <template v-slot:label>
           I agree to the&nbsp;
           <a href="#" @click.stop.prevent="dialog = true">Terms of Service</a>
           &nbsp;and&nbsp;
diff --git a/packages/docs/src/examples/time-pickers/timeDialogAndMenu.vue b/packages/docs/src/examples/time-pickers/timeDialogAndMenu.vue
index d71d646cd68..882dbec9d1a 100644
--- a/packages/docs/src/examples/time-pickers/timeDialogAndMenu.vue
+++ b/packages/docs/src/examples/time-pickers/timeDialogAndMenu.vue
@@ -14,13 +14,15 @@
         max-width="290px"
         min-width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="time"
-          label="Picker in menu"
-          prepend-icon="access_time"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="time"
+            label="Picker in menu"
+            prepend-icon="access_time"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-time-picker
           v-if="menu2"
           v-model="time"
@@ -40,13 +42,15 @@
         full-width
         width="290px"
       >
-        <v-text-field
-          slot="activator"
-          v-model="time"
-          label="Picker in dialog"
-          prepend-icon="access_time"
-          readonly
-        ></v-text-field>
+        <template v-slot:activator="{ on }">
+          <v-text-field
+            v-model="time"
+            label="Picker in dialog"
+            prepend-icon="access_time"
+            readonly
+            v-on="on"
+          ></v-text-field>
+        </template>
         <v-time-picker
           v-if="modal2"
           v-model="time"
diff --git a/packages/docs/src/examples/timelines/advanced.vue b/packages/docs/src/examples/timelines/advanced.vue
index bc003ee5767..09ab006a32f 100644
--- a/packages/docs/src/examples/timelines/advanced.vue
+++ b/packages/docs/src/examples/timelines/advanced.vue
@@ -7,7 +7,9 @@
         color="orange"
         large
       >
-        <span slot="icon">JL</span>
+        <template v-slot:icon>
+          <span>JL</span>
+        </template>
         <v-text-field
           v-model="input"
           hide-details
@@ -16,7 +18,7 @@
           solo
           @keydown.enter="comment"
         >
-          <template slot="append">
+          <template v-slot:append>
             <v-btn
               class="mx-0"
               depressed
diff --git a/packages/docs/src/examples/timelines/avatars.vue b/packages/docs/src/examples/timelines/avatars.vue
index f8eb00b0660..e19cbaa03c0 100644
--- a/packages/docs/src/examples/timelines/avatars.vue
+++ b/packages/docs/src/examples/timelines/avatars.vue
@@ -5,10 +5,14 @@
       :key="n"
       large
     >
-      <v-avatar slot="icon">
-        <img src="http://i.pravatar.cc/64">
-      </v-avatar>
-      <span slot="opposite">Tus eu perfecto</span>
+      <template v-slot:icon>
+        <v-avatar>
+          <img src="http://i.pravatar.cc/64">
+        </v-avatar>
+      </template>
+      <template v-slot:opposite>
+        <span>Tus eu perfecto</span>
+      </template>
       <v-card class="elevation-2">
         <v-card-title class="headline">Lorem ipsum</v-card-title>
         <v-card-text>Lorem ipsum dolor sit amet, no nam oblique veritus. Commune scaevola imperdiet nec ut, sed euismod convenire principes at. Est et nobis iisque percipit, an vim zril disputando voluptatibus, vix an salutandi sententiae.</v-card-text>
diff --git a/packages/docs/src/examples/timelines/slot.vue b/packages/docs/src/examples/timelines/slot.vue
index 18735123305..e938311d95d 100644
--- a/packages/docs/src/examples/timelines/slot.vue
+++ b/packages/docs/src/examples/timelines/slot.vue
@@ -6,11 +6,12 @@
       :color="year.color"
       small
     >
-      <span
-        slot="opposite"
-        :class="`headline font-weight-bold ${year.color}--text`"
-        v-text="year.year"
-      ></span>
+      <template v-slot:opposite>
+        <span
+          :class="`headline font-weight-bold ${year.color}--text`"
+          v-text="year.year"
+        ></span>
+      </template>
       <div class="py-3">
         <h2 :class="`headline font-weight-light mb-3 ${year.color}--text`">Lorem ipsum</h2>
         <div>
diff --git a/packages/docs/src/examples/timelines/usage.vue b/packages/docs/src/examples/timelines/usage.vue
index e84002747aa..ee6774dde4a 100644
--- a/packages/docs/src/examples/timelines/usage.vue
+++ b/packages/docs/src/examples/timelines/usage.vue
@@ -6,7 +6,9 @@
       color="red lighten-2"
       large
     >
-      <span slot="opposite">Tus eu perfecto</span>
+      <template v-slot:opposite>
+        <span>Tus eu perfecto</span>
+      </template>
       <v-card class="elevation-2">
         <v-card-title class="headline">Lorem ipsum</v-card-title>
         <v-card-text>
diff --git a/packages/docs/src/examples/toolbars/appBarExtension.vue b/packages/docs/src/examples/toolbars/appBarExtension.vue
index 74b2ed5fbbd..8d5decd446e 100644
--- a/packages/docs/src/examples/toolbars/appBarExtension.vue
+++ b/packages/docs/src/examples/toolbars/appBarExtension.vue
@@ -6,7 +6,7 @@
   >
     <v-toolbar-side-icon></v-toolbar-side-icon>
 
-    <v-toolbar-title slot="extension" class="white--text">Title</v-toolbar-title>
+    <v-toolbar-title v-slot:extension class="white--text">Title</v-toolbar-title>
 
     <v-spacer></v-spacer>
 
diff --git a/packages/docs/src/examples/toolbars/appBarMenu.vue b/packages/docs/src/examples/toolbars/appBarMenu.vue
index e37625f3024..904d464b708 100644
--- a/packages/docs/src/examples/toolbars/appBarMenu.vue
+++ b/packages/docs/src/examples/toolbars/appBarMenu.vue
@@ -8,10 +8,12 @@
       <v-toolbar-side-icon></v-toolbar-side-icon>
 
       <v-menu :nudge-width="100">
-        <v-toolbar-title slot="activator">
-          <span>All</span>
-          <v-icon dark>arrow_drop_down</v-icon>
-        </v-toolbar-title>
+        <template v-slot:activator="{ on }">
+          <v-toolbar-title v-on="on">
+            <span>All</span>
+            <v-icon dark>arrow_drop_down</v-icon>
+          </v-toolbar-title>
+        </template>
 
         <v-list>
           <v-list-tile
diff --git a/packages/docs/src/examples/tooltips/alignment.vue b/packages/docs/src/examples/tooltips/alignment.vue
index 936a4bd8a2a..b0f9a0b8bda 100644
--- a/packages/docs/src/examples/tooltips/alignment.vue
+++ b/packages/docs/src/examples/tooltips/alignment.vue
@@ -1,29 +1,29 @@
 <template>
   <div class="text-xs-center">
     <v-tooltip left>
-      <template #activator="data">
-        <v-btn color="primary" dark v-on="data.on">Left</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Left</v-btn>
       </template>
       <span>Left tooltip</span>
     </v-tooltip>
 
     <v-tooltip top>
-      <template #activator="data">
-        <v-btn color="primary" dark v-on="data.on">Top</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Top</v-btn>
       </template>
       <span>Top tooltip</span>
     </v-tooltip>
 
     <v-tooltip bottom>
-      <template #activator="data">
-        <v-btn color="primary" dark v-on="data.on">Bottom</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Bottom</v-btn>
       </template>
       <span>Bottom tooltip</span>
     </v-tooltip>
 
     <v-tooltip right>
-      <template #activator="data">
-        <v-btn color="primary" dark v-on="data.on">Right</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Right</v-btn>
       </template>
       <span>Right tooltip</span>
     </v-tooltip>
diff --git a/packages/docs/src/examples/tooltips/usage.vue b/packages/docs/src/examples/tooltips/usage.vue
index e71f01945ea..2fe34efab8b 100644
--- a/packages/docs/src/examples/tooltips/usage.vue
+++ b/packages/docs/src/examples/tooltips/usage.vue
@@ -1,22 +1,22 @@
 <template>
   <div class="text-xs-center d-flex align-center">
     <v-tooltip bottom>
-      <template #activator="data">
-        <v-btn color="primary" dark v-on="data.on">Button</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn color="primary" dark v-on="on">Button</v-btn>
       </template>
       <span>Tooltip</span>
     </v-tooltip>
 
     <v-tooltip bottom>
-      <template #activator="data">
-        <v-icon color="primary" dark v-on="data.on">home</v-icon>
+      <template v-slot:activator="{ on }">
+        <v-icon color="primary" dark v-on="on">home</v-icon>
       </template>
       <span>Tooltip</span>
     </v-tooltip>
 
     <v-tooltip bottom>
-      <template #activator="data">
-        <span v-on="data.on">This text has a tooltip</span>
+      <template v-slot:activator="{ on }">
+        <span v-on="on">This text has a tooltip</span>
       </template>
       <span>Tooltip</span>
     </v-tooltip>
diff --git a/packages/docs/src/examples/tooltips/visibility.vue b/packages/docs/src/examples/tooltips/visibility.vue
index 5422b76ffab..ffe0ed4ec2e 100644
--- a/packages/docs/src/examples/tooltips/visibility.vue
+++ b/packages/docs/src/examples/tooltips/visibility.vue
@@ -12,8 +12,8 @@
 
       <v-flex xs12 class="mt-5">
         <v-tooltip v-model="show" top>
-          <template #activator="data">
-            <v-btn icon v-on="data.on">
+          <template v-slot:activator="{ on }">
+            <v-btn icon v-on="on">
               <v-icon color="grey lighten-1">shopping_cart</v-icon>
             </v-btn>
           </template>
diff --git a/packages/docs/src/examples/transitions/customOrigin.vue b/packages/docs/src/examples/transitions/customOrigin.vue
index 0894fe102e1..9779fad3262 100644
--- a/packages/docs/src/examples/transitions/customOrigin.vue
+++ b/packages/docs/src/examples/transitions/customOrigin.vue
@@ -1,7 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu transition="scale-transition" origin="center center">
-      <v-btn slot="activator" dark color="primary">Scale Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="primary"
+          v-on="on"
+        >
+          Scale Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
diff --git a/packages/docs/src/examples/transitions/fadeTransition.vue b/packages/docs/src/examples/transitions/fadeTransition.vue
index fe64ed32f59..9294f8d52da 100644
--- a/packages/docs/src/examples/transitions/fadeTransition.vue
+++ b/packages/docs/src/examples/transitions/fadeTransition.vue
@@ -1,7 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu transition="fade-transition">
-      <v-btn slot="activator" dark color="primary">Fade Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="primary"
+          v-on="on"
+        >
+          Fade Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
diff --git a/packages/docs/src/examples/transitions/scaleTransition.vue b/packages/docs/src/examples/transitions/scaleTransition.vue
index 2d6dc9a3cec..0c4b0654e06 100644
--- a/packages/docs/src/examples/transitions/scaleTransition.vue
+++ b/packages/docs/src/examples/transitions/scaleTransition.vue
@@ -1,7 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu transition="scale-transition">
-      <v-btn slot="activator" dark color="primary">Scale Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="primary"
+          v-on="on"
+        >
+          Scale Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
diff --git a/packages/docs/src/examples/transitions/slideXTransitions.vue b/packages/docs/src/examples/transitions/slideXTransitions.vue
index e3dd2f36364..96a4fc06219 100644
--- a/packages/docs/src/examples/transitions/slideXTransitions.vue
+++ b/packages/docs/src/examples/transitions/slideXTransitions.vue
@@ -1,7 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu transition="slide-x-transition">
-      <v-btn slot="activator" dark color="primary">Slide X Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="primary"
+          v-on="on"
+        >
+          Slide X Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
@@ -9,7 +17,15 @@
       </v-list>
     </v-menu>
     <v-menu transition="slide-x-reverse-transition">
-      <v-btn slot="activator" dark color="secondary">Slide X Reverse Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="secondary"
+          v-on="on"
+        >
+          Slide X Reverse Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
diff --git a/packages/docs/src/examples/transitions/slideYTransitions.vue b/packages/docs/src/examples/transitions/slideYTransitions.vue
index 5c9e9565ff5..c79d5f49ba8 100644
--- a/packages/docs/src/examples/transitions/slideYTransitions.vue
+++ b/packages/docs/src/examples/transitions/slideYTransitions.vue
@@ -1,7 +1,15 @@
 <template>
   <div class="text-xs-center">
     <v-menu transition="slide-y-transition">
-      <v-btn slot="activator" dark color="primary">Slide Y Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="primary"
+          v-on="on"
+        >
+          Slide Y Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
@@ -9,7 +17,15 @@
       </v-list>
     </v-menu>
     <v-menu transition="slide-y-reverse-transition">
-      <v-btn slot="activator" dark color="primary">Slide Y Reverse Transition</v-btn>
+      <template v-slot:activator="{ on }">
+        <v-btn
+          dark
+          color="secondary"
+          v-on="on"
+        >
+          Slide Y Reverse Transition
+        </v-btn>
+      </template>
       <v-list>
         <v-list-tile v-for="n in 5" :key="n" @click="">
           <v-list-tile-title v-text="'Item ' + n"></v-list-tile-title>
diff --git a/packages/docs/src/examples/transitions/todo.vue b/packages/docs/src/examples/transitions/todo.vue
index 211829c4f6e..75344f9bec7 100644
--- a/packages/docs/src/examples/transitions/todo.vue
+++ b/packages/docs/src/examples/transitions/todo.vue
@@ -6,7 +6,7 @@
       solo
       @keydown.enter="create"
     >
-      <v-fade-transition slot="append">
+      <v-fade-transition v-slot:append>
         <v-icon
           v-if="task"
           @click="create"
@@ -69,12 +69,13 @@
                 v-model="task.done"
                 color="info darken-3"
               >
-                <div
-                  slot="label"
-                  :class="task.done && 'grey--text' || 'text--primary'"
-                  class="ml-3"
-                  v-text="task.text"
-                ></div>
+                <template v-slot:label>
+                  <div
+                    :class="task.done && 'grey--text' || 'text--primary'"
+                    class="ml-3"
+                    v-text="task.text"
+                  ></div>
+                </template>
               </v-checkbox>
             </v-list-tile-action>
 
diff --git a/packages/docs/src/examples/treeview/directory.vue b/packages/docs/src/examples/treeview/directory.vue
index f8cba2a50d8..6fea41dfb3b 100644
--- a/packages/docs/src/examples/treeview/directory.vue
+++ b/packages/docs/src/examples/treeview/directory.vue
@@ -19,12 +19,14 @@
           open-on-click
           transition
         >
-          <v-icon
-            v-if="!item.children"
-            slot="prepend"
-            slot-scope="{ item, active }"
-            :color="active ? 'primary' : ''"
-          >mdi-account</v-icon>
+          <template v-slot:prepend="{ item, active }">
+            <v-icon
+              v-if="!item.children"
+              :color="active ? 'primary' : ''"
+            >
+              mdi-account
+            </v-icon>
+          </template>
         </v-treeview>
       </v-flex>
       <v-flex
diff --git a/packages/docs/src/examples/treeview/fileExplorer.vue b/packages/docs/src/examples/treeview/fileExplorer.vue
index 8499347db7a..cd07c99d25c 100644
--- a/packages/docs/src/examples/treeview/fileExplorer.vue
+++ b/packages/docs/src/examples/treeview/fileExplorer.vue
@@ -7,7 +7,7 @@
     item-key="name"
     open-on-click
   >
-    <template slot="prepend" slot-scope="{ item, open }">
+    <template v-slot:prepend="{ item, open }">
       <v-icon v-if="!item.file">
         {{ open ? 'mdi-folder-open' : 'mdi-folder' }}
       </v-icon>
diff --git a/packages/docs/src/examples/treeview/humanResources.vue b/packages/docs/src/examples/treeview/humanResources.vue
index ad83f9fd65b..85971ae7764 100644
--- a/packages/docs/src/examples/treeview/humanResources.vue
+++ b/packages/docs/src/examples/treeview/humanResources.vue
@@ -28,10 +28,7 @@
         :filter="filter"
         :open.sync="open"
       >
-        <template
-          slot="prepend"
-          slot-scope="{ item }"
-        >
+        <template v-slot:prepend="{ item }">
           <v-icon
             v-if="item.children"
             v-text="`mdi-${item.id === 1 ? 'home-variant' : 'folder-network'}`"
diff --git a/packages/docs/src/pages/home/components/Footer.vue b/packages/docs/src/pages/home/components/Footer.vue
index 61e071f05ab..0f5c8d1e470 100644
--- a/packages/docs/src/pages/home/components/Footer.vue
+++ b/packages/docs/src/pages/home/components/Footer.vue
@@ -66,16 +66,17 @@
               hide-details
               label="Email Address"
             >
-              <v-btn
-                slot="append"
-                type="submit"
-                color="secondary"
-                name="member[subscribe]"
-                value="Subscribe"
-                @click="email = ''"
-              >
-                Subscribe
-              </v-btn>
+              <template v-slot:append>
+                <v-btn
+                  type="submit"
+                  color="secondary"
+                  name="member[subscribe]"
+                  value="Subscribe"
+                  @click="email = ''"
+                >
+                  Subscribe
+                </v-btn>
+              </template>
             </v-text-field>
           </v-form>
           <div class="text-xs-center caption">
diff --git a/packages/docs/src/snippets/html/ie11.txt b/packages/docs/src/snippets/html/ie11.txt
index 039540fd30e..0f330b3f04a 100644
--- a/packages/docs/src/snippets/html/ie11.txt
+++ b/packages/docs/src/snippets/html/ie11.txt
@@ -1,3 +1,3 @@
-<template slot="items" slot-scope="props">
+<template v-slot:items="props">
   <td>{‌{ props.item.name }‌}</td>
 </template>