<div id="app">
  <v-app id="inspire">
    <v-card
      max-width="400"
      class="mx-auto"
    >
      <v-system-bar color="pink darken-2"></v-system-bar>
  
      <v-app-bar dark color="pink">
        <v-app-bar-nav-icon></v-app-bar-nav-icon>
  
        <v-toolbar-title>My Music</v-toolbar-title>
  
        <v-spacer></v-spacer>
  
        <v-btn icon>
          <v-icon>mdi-magnify</v-icon>
        </v-btn>
      </v-app-bar>
  
      <v-container
        class="pa-2"
        fluid
        grid-list-md
      >
        <v-layout column>
          <v-flex>
            <v-card
              color="#385F73"
              dark
            >
              <v-card-text class="white--text">
                <div class="headline mb-2">Unlimited music now</div>
                Listen to your favorite artists and albums whenever and wherever, online and offline.
              </v-card-text>
  
              <v-card-actions>
                <v-btn text>Listen Now</v-btn>
              </v-card-actions>
            </v-card>
          </v-flex>
  
          <v-flex
            v-for="(item, i) in items"
            :key="i"
          >
            <v-card
              :color="item.color"
              dark
            >
              <v-list-item three-line>
                <v-list-item-content>
                  <v-list-item-title
                    class="headline mb-2"
                    v-text="item.title"
                  ></v-list-item-title>
  
                  <v-list-item-subtitle v-text="item.artist"></v-list-item-subtitle>
  
                   <v-btn class="btn-bottom-left">Прижми меня к низу</v-btn>
                  
                  
                </v-list-item-content>
  
                <v-list-item-avatar
                  size="125"
                  tile
                >
                  <v-img :src="item.src"></v-img>
                </v-list-item-avatar>
              </v-list-item>
            </v-card>
          </v-flex>
        </v-layout>
      </v-container>
    </v-card>
  </v-app>
</div>
.btn-bottom-left {
  display: inline-block;
    width: 100px;
    padding: 0;
    color: white;
    background: black;
    text-transform: uppercase;
    text-decoration: none;
    text-align: center;
}
new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: () => ({
    items: [
      {
        color: '#1F7087',
        src: 'https://cdn.vuetifyjs.com/images/cards/foster.jpg',
        title: 'Supermodel',
        artist: 'Foster the People',
      },
      {
        color: '#952175',
        src: 'https://cdn.vuetifyjs.com/images/cards/halcyon.png',
        title: 'Halcyon Days',
        artist: 'Ellie Goulding',
      },
    ],
  }),
})
View Compiled

External CSS

  1. https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900
  2. https://cdn.jsdelivr.net/npm/@mdi/font@3.x/css/materialdesignicons.min.css
  3. https://fonts.googleapis.com/css?family=Material+Icons
  4. https://cdn.jsdelivr.net/npm/vuetify@2.0.5/dist/vuetify.min.css

External JavaScript

  1. https://cdn.jsdelivr.net/npm/babel-polyfill/dist/polyfill.min.js
  2. https://cdn.jsdelivr.net/npm/vue@2.x/dist/vue.js
  3. https://cdn.jsdelivr.net/npm/vuetify@2.0.5/dist/vuetify.min.js