diff --git a/_static/css/furo-phoenix.css b/_static/css/furo-phoenix.css
index a548cca2..b81c0127 100644
--- a/_static/css/furo-phoenix.css
+++ b/_static/css/furo-phoenix.css
@@ -148,13 +148,121 @@ img {
     border-right: none !important;
     box-sizing: border-box;
     display: flex;
+    flex-direction: column !important;
     justify-content: flex-start !important;
-    width: 17em !important
+    width: 17em !important;
+    position: fixed !important
+}
+
+.sidebar-container.shift-down {
+    box-sizing: border-box;
+    width: inherit !important;
+    height: 90vh !important
 }
 
 .sidebar-container {
     box-sizing: border-box;
-    width: 17em !important
+    width: inherit !important;
+    height: 96vh !important
+}
+
+.sidebar-sticky {
+    height: inherit !important
+}
+
+.version-container.shift-up {
+    width: inherit !important;
+    height: 10vh !important;
+    border-top: 2px solid #c2cbcb !important;
+    background-color: #f1f3f3 !important;
+    font-family: 'Open Sans', sans-serif !important;
+    font-weight: 600 !important;
+    color: var(--color-sidebar-link-text--top-level) !important
+}
+
+.version-container {
+    width: inherit !important;
+    height: 4vh !important;
+    border-top: 2px solid #c2cbcb !important;
+    background-color: #f1f3f3 !important;
+    font-family: 'Open Sans', sans-serif !important;
+    font-weight: 600 !important;
+    color: var(--color-sidebar-link-text--top-level) !important
+}
+
+.default-version {
+    display: flex !important;
+    justify-content: space-between !important;
+    cursor: pointer !important
+}
+
+.default-version:hover {
+    background-color: #ea5b22 !important;
+    color: white !important
+}
+
+.default-version > label {
+    display: flex !important;
+    align-items: center !important;
+    justify-content: center !important;
+    cursor: pointer !important;
+    width: var(--sidebar-expander-width) !important;
+    height: var(--sidebar-item-height) !important
+}
+
+.version-top {
+    flex: 1 !important;
+    display: flex !important;
+    justify-content: space-between !important;
+    align-items: center !important;
+    padding-left: 10px !important
+}
+
+.version-container.shift-up > .default-version label > .icon > svg {
+    transform: rotate(-90deg) !important
+}
+
+.default-version label > .icon > svg {
+    transform: rotate(90deg) !important
+}
+
+.version-container.shift-up .other-versions {
+    margin-right: 10px !important;
+    margin-left: 10px !important;
+    box-sizing: border-box !important;
+    display: block !important
+}
+
+.other-versions {
+    margin-right: 10px !important;
+    margin-left: 10px !important;
+    box-sizing: border-box !important;
+    display: none !important
+}
+
+.other-versions > dl {
+    margin-top: 7px !important
+}
+
+.other-versions > dl > dd {
+    display: inline-block !important;
+    margin: 0 !important;
+    padding: 5px !important
+}
+
+.other-versions > dl > dd > a {
+    text-decoration: none !important;
+    font-weight: 500 !important;
+    color: var(--color-sidebar-link-text--top-level) !important
+}
+
+.other-versions > dl > dd > a:hover {
+    font-weight: 500 !important;
+    color: #ea5b22 !important
+}
+
+.main {
+    margin-left: 17em !important
 }
 
 /* Hide sidebar brand text */
diff --git a/_static/js/versions.js b/_static/js/versions.js
new file mode 100644
index 00000000..9faea431
--- /dev/null
+++ b/_static/js/versions.js
@@ -0,0 +1,34 @@
+// Provide not server run
+if (window.location.origin !== 'null') {
+    const baseurl = 'https://docs.phoenix-rtos.com/'
+    let baseTag = document.querySelector('base');
+
+    // If not, create and append one
+    if (!baseTag) {
+        baseTag = document.createElement('base');
+        document.head.appendChild(baseTag);
+    }
+
+    if (baseTag) {
+        baseTag.href = baseurl + 'latest' + '/';
+    }
+
+    const versions = document.querySelector('.other-versions');
+    const curr_version = document.querySelector('.curr-version');
+
+    versions.querySelectorAll('a').forEach(anchor => {
+        anchor.addEventListener('click', function() {
+            curr_version.textContent = 'v: ' + anchor.textContent;
+            baseTag.href = baseurl + anchor.textContent + '/';
+        });
+    });
+}
+
+const triggerElement = document.querySelector('.default-version');
+const versionContainer = document.querySelector('.version-container');
+const sidebarContainer = document.querySelector('.sidebar-container');
+
+triggerElement.addEventListener('click', function() {
+    versionContainer.classList.toggle('shift-up');
+    sidebarContainer.classList.toggle('shift-down');
+});
diff --git a/_templates/page.html b/_templates/page.html
index b338caba..8e51ce77 100644
--- a/_templates/page.html
+++ b/_templates/page.html
@@ -57,6 +57,7 @@
       </div>
       {% endblock left_sidebar %}
     </div>
+    {% include "versions.html" %}
   </aside>
   <div class="main">
     <div class="content">
diff --git a/_templates/versions.html b/_templates/versions.html
new file mode 100644
index 00000000..5da47d1b
--- /dev/null
+++ b/_templates/versions.html
@@ -0,0 +1,19 @@
+<div class="version-container">
+    <div class="default-version">
+        <span class="version-top">
+            <span>Phoenix-RTOS</span>
+            <span class="curr-version">v: latest</span>
+        </span>
+        <label>
+            <i class="icon"><svg class="furo-related-icon"><use href="#svg-arrow-right"></use></svg></i>
+        </label>
+    </div>
+    <div class="other-versions">
+        <dl>
+            <span>Document Release Versions:</span>
+            {% for name, url in versions %}
+                <dd><a href="{{ url }}">{{ name }}</a></dd>
+            {% endfor %}
+        </dl>
+    </div>
+</div>
diff --git a/conf.py b/conf.py
index 8be6429a..ef23c78c 100644
--- a/conf.py
+++ b/conf.py
@@ -29,9 +29,19 @@
 html_title = 'Phoenix-RTOS Documentation'
 html_favicon = '_images/RTOS_sign.png'
 html_theme = 'furo'
-html_js_files = ['js/functions.js']
+html_js_files = ['js/functions.js', 'js/versions.js']
 html_style = ['css/furo-phoenix.css', 'css/furo-extensions-phoenix.css']
 html_static_path = ['_static', '_images']
+html_baseurl = "https://docs.phoenix-rtos.com"
+html_context = {
+"versions": (
+        ("latest", f"{html_baseurl}/latest"),
+        ("1.0.0", f"{html_baseurl}/1.0.0/"),
+        ("1.0.1", f"{html_baseurl}/1.0.1/"),
+        ("1.0.2", f"{html_baseurl}/1.0.2/"),
+    )
+}
+
 # TODO: add dark mode support
 html_theme_options = {
 	"light_logo": "light_logo.png",