diff --git a/docs/assets/css/style.css b/docs/assets/css/style.css
index b46ee5f60..859a71132 100644
--- a/docs/assets/css/style.css
+++ b/docs/assets/css/style.css
@@ -48,6 +48,12 @@ img {
     background-color: rgb(28, 32, 34);
 }
 
+.version {
+    font-size: 12px;
+    color: #44d808;
+    margin-left: 5px;
+}
+
 .header .menus {
     display: flex;
     align-items: center;
diff --git a/docs/assets/js/common.js b/docs/assets/js/common.js
index 9845a1dd1..81643e910 100644
--- a/docs/assets/js/common.js
+++ b/docs/assets/js/common.js
@@ -9,8 +9,11 @@
     var $lib = document.querySelector('.libsInput');
     var $run = document.querySelector('.run');
     var $popups = document.querySelector('.popups');
+    var $version = document.querySelector('.version');
     var loaddLib = [];
 
+    $version.textContent = 'v' + Artplayer.version;
+
     consola.creat({
         target: '.console',
         size: '100%',
diff --git a/docs/index.html b/docs/index.html
index b2f1aad2b..dd618cba7 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -21,7 +21,7 @@
     <section class="main">
         <div class="part-left">
             <header class="header">
-                <a href="./" class="logo">Artplayer.js</a>
+                <a href="./" class="logo">Artplayer.js<span class="version"></span></a>
                 <div class="menus">
                     <div class="item has-sub-menu">
                         Ecosystem