diff --git a/src/res/css/extra_styles.css b/src/res/css/extra_styles.css
index 88e4a8d10e17d410aa6dcce4fbd3a842cb437766..c52fbef10e7d9726a25df89efa5160b283b59b30 100644
--- a/src/res/css/extra_styles.css
+++ b/src/res/css/extra_styles.css
@@ -438,6 +438,11 @@ markdown-dom pre code
   opacity: 0.5!important;
 }
 
+.muted-3
+{
+  opacity: 0.3!important;
+}
+
 .card
 {
   background:none;
diff --git a/src/ui/quickTour/quickTour.service.ts b/src/ui/quickTour/quickTour.service.ts
index 5bac137e880df2ab48f1a7da9ee94db07079a2fc..d4a7552c24053232643d1862c8733584a03b1e61 100644
--- a/src/ui/quickTour/quickTour.service.ts
+++ b/src/ui/quickTour/quickTour.service.ts
@@ -6,7 +6,7 @@ import { QuickTourThis } from "./quickTourThis.directive";
 import { DoublyLinkedList, IDoublyLinkedItem } from 'src/util'
 import { QUICK_TOUR_CMP_INJTKN } from "./constrants";
 
-export function findInLinkedList<T>(first: IDoublyLinkedItem<T>, predicate: (linkedObj: IDoublyLinkedItem<T>) => boolean): IDoublyLinkedItem<T>{
+export function findInLinkedList<T extends object>(first: IDoublyLinkedItem<T>, predicate: (linkedObj: IDoublyLinkedItem<T>) => boolean): IDoublyLinkedItem<T>{
   let compareObj = first,
     returnObj: IDoublyLinkedItem<T> = null
 
@@ -43,11 +43,6 @@ export class QuickTourService {
      */
     @Inject(QUICK_TOUR_CMP_INJTKN) private quickTourCmp: any,
   ){
-
-    // todo remove in production
-    setTimeout(() => {
-      this.startTour()
-    }, 2500)
   }
 
   public register(dir: QuickTourThis) {
diff --git a/src/ui/quickTour/quickTourComponent/quickTour.component.ts b/src/ui/quickTour/quickTourComponent/quickTour.component.ts
index 471bd58f7fa79ec1d568330e0365337ba4fe4cfa..393b025d284351cd5eb0348f81732251ab23c373 100644
--- a/src/ui/quickTour/quickTourComponent/quickTour.component.ts
+++ b/src/ui/quickTour/quickTourComponent/quickTour.component.ts
@@ -5,7 +5,7 @@ import {
   SecurityContext,
   TemplateRef,
 } from "@angular/core";
-import { Subscription } from "rxjs";
+import { combineLatest, Subscription } from "rxjs";
 import { QuickTourService } from "../quickTour.service";
 import { debounceTime, map, shareReplay} from "rxjs/operators";
 import { DomSanitizer } from "@angular/platform-browser";
@@ -68,6 +68,23 @@ export class QuickTourComponent {
     map(val => val.thisObj.description)
   )
 
+  private quickTourSize$ = this.currTipLinkedObj$.pipe(
+    map(val => val.list.size())
+  )
+
+  private quickTourIdx$ = this.currTipLinkedObj$.pipe(
+    map(val => val.index)
+  )
+
+  public quickTourProgress$ = combineLatest([
+    this.quickTourSize$,
+    this.quickTourIdx$
+  ]).pipe(
+    map(([ size, idx ]) => {
+      return Array(size).fill(false).map((_, index) => index === idx ? 'active' : _)
+    })
+  )
+
   public overwrittenPosition = this.currTipLinkedObj$.pipe(
     map(val => val.thisObj.overwritePosition)
   )
diff --git a/src/ui/quickTour/quickTourComponent/quickTour.template.html b/src/ui/quickTour/quickTourComponent/quickTour.template.html
index af727722186a62518f73be4105ae5311a3ad0095..d99b89dbe039c81aff29215da1d7bc3dff38d3ca 100644
--- a/src/ui/quickTour/quickTourComponent/quickTour.template.html
+++ b/src/ui/quickTour/quickTourComponent/quickTour.template.html
@@ -22,6 +22,11 @@
             (click)="endTour()">
             <i class="fas fa-times"></i>
         </button>
+        <span class="muted d-inline-flex align-items-center">
+            <i *ngFor="let active of quickTourProgress$ | async"
+                [ngClass]="{ 'fa-xs muted-3': !active }"
+                class="ml-1 fas fa-circle"></i>
+        </span>
     </mat-card-actions>
 </mat-card>
 
diff --git a/src/util/LinkedList.ts b/src/util/LinkedList.ts
index 86f2ab618b4ce27fdc6a7dbe34e7f79151166a2f..5432aaafeac0a82f21bc9e65df51f46dc092ae6e 100644
--- a/src/util/LinkedList.ts
+++ b/src/util/LinkedList.ts
@@ -1,7 +1,9 @@
-export interface IDoublyLinkedItem<T> {
+export interface IDoublyLinkedItem<T extends object> {
   next: IDoublyLinkedItem<T>
   prev: IDoublyLinkedItem<T>
   thisObj: T
+  readonly index: number
+  list: DoublyLinkedList<T>
 }
 
 export class DoublyLinkedList<T extends object>{
@@ -32,7 +34,17 @@ export class DoublyLinkedList<T extends object>{
     const newDoublyLinkedItem: IDoublyLinkedItem<T> = {
       prev: insertAfter,
       next: newDoublyLinkedItemNext,
-      thisObj: element
+      thisObj: element,
+      get index() {
+        let count = 0, prev: IDoublyLinkedItem<T>
+        prev = this.prev
+        while (prev) {
+          prev = prev.prev
+          count ++
+        }
+        return count
+      },
+      list: this
     }
 
     /**