diff --git a/src/views/interface/ThemeList.vue b/src/views/interface/ThemeList.vue
index 9dd765be..8d4d6ddf 100644
--- a/src/views/interface/ThemeList.vue
+++ b/src/views/interface/ThemeList.vue
@@ -1,5 +1,68 @@
 <template>
-  <div> Theme List </div>
+  <div>
+    <a-row :gutter="12" type="flex" align="middle">
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+      <a-col :xl="6" :lg="6" :md="6" :sm="12" :xs="24">
+        <a-card hoverable>
+          <img alt="example" src="https://ryanc.cc/material/screenshot.png" slot="cover">
+          <template class="ant-card-actions" slot="actions">
+            <a-icon type="check"/>
+            <a-icon type="setting"/>
+          </template>
+          <a-card-meta title="Anatole"></a-card-meta>
+        </a-card>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script>
diff --git a/src/views/post/TagList.vue b/src/views/post/TagList.vue
index 09c107c1..44d89131 100644
--- a/src/views/post/TagList.vue
+++ b/src/views/post/TagList.vue
@@ -1,5 +1,57 @@
 <template>
-  <div> Tag List </div>
+  <div>
+    <a-row :gutter="12">
+      <a-col :xl="10" :lg="10" :md="10" :sm="24" :xs="24">
+        <a-card hoverable title="添加标签">
+          <a-form :layout="horizontal">
+            <a-form-item label="名称：" help="*页面上所显示的名称">
+              <a-input/>
+            </a-form-item>
+            <a-form-item label="路径名称：" help="*这是文章路径上显示的名称，最好为英文">
+              <a-input/>
+            </a-form-item>
+            <a-form-item>
+              <a-button type="primary">保存</a-button>
+            </a-form-item>
+          </a-form>
+        </a-card>
+      </a-col>
+      <a-col :xl="14" :lg="14" :md="14" :sm="24" :xs="24">
+        <a-card hoverable title="所有标签">
+          <a-tooltip placement="topLeft">
+            <template slot="title">
+              <span>10 篇文章</span>
+            </template>
+            <a-tag color="pink">Java</a-tag>
+          </a-tooltip>
+          <a-tooltip placement="topLeft">
+            <template slot="title">
+              <span>10 篇文章</span>
+            </template>
+            <a-tag color="red">PHP</a-tag>
+          </a-tooltip>
+          <a-tooltip placement="topLeft">
+            <template slot="title">
+              <span>10 篇文章</span>
+            </template>
+            <a-tag color="orange">.NET</a-tag>
+          </a-tooltip>
+          <a-tooltip placement="topLeft">
+            <template slot="title">
+              <span>10 篇文章</span>
+            </template>
+            <a-tag color="green">Python</a-tag>
+          </a-tooltip>
+          <a-tooltip placement="topLeft">
+            <template slot="title">
+              <span>10 篇文章</span>
+            </template>
+            <a-tag color="pink">Golang</a-tag>
+          </a-tooltip>
+        </a-card>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script>