diff --git a/frontend/src/components/HelloWorld.vue b/frontend/src/components/HelloWorld.vue
index 879051a..49ecfcc 100644
--- a/frontend/src/components/HelloWorld.vue
+++ b/frontend/src/components/HelloWorld.vue
@@ -1,4 +1,7 @@
 <template>
+  <div>
+  <el-button>I am ElButton</el-button>
+  </div>
   <div class="hello">
     <h1>{{ msg }}</h1>
     <p>
@@ -31,10 +34,15 @@
 </template>
 
 <script>
+import { ElButton } from 'element-plus';
+
 export default {
   name: 'HelloWorld',
   props: {
     msg: String
+  },
+  components: {
+    ElButton
   }
 }
 </script>
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 3e79677..cce8347 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -1,5 +1,7 @@
 import { createApp } from 'vue'
 import App from './App.vue'
 import router from './router'
+import ElementPlus from 'element-plus'
+import 'element-plus/dist/index.css'
 
-createApp(App).use(router).mount('#app')
+createApp(App).use(router).use(ElementPlus).mount('#app')