Vuetifyで既存ページのデザインを改善してみた - Qiita

はじめに 最近 Vue.jsとVuetifyに出会って 「こんな簡単に綺麗なサイト作れるんかよ！」 って衝撃を受けました。 せっかくなら前に作ったツールのデザインもVuetifyで改善してみたいと思ってやってみることに。 ビフォー 改善前のページがこちら htmlとcssだけで短時間で作ろうとするとこんな出来栄えになりました・・・； 良い点を挙げるならシンプルなとこかな（？） なのでシンプルを維持したままデザインを改善してみました。 アフター Vuetifyでデザインを改善したものがこちら なかなかいい感じ！ 全部 <v-card> の中に納めました。 リンク生成ボタンを押した後に表示したい要素は<v-expand-transition>に入れることでスッキリしました。 さいごに Vuetifyで書くとめちゃくちゃ簡単にUI改良できるので楽しすぎる。 実はフレームワーク使うのって今回が初め