diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index dd607cd4..6df66aef 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -84,6 +84,7 @@ import { environment } from '../environments/environment';
 import { BookmarksComponent } from './components/floating-column/manage-account/bookmarks/bookmarks.component';
 import { AttachementImageComponent } from './components/stream/status/attachements/attachement-image/attachement-image.component';
 import { EnsureHttpsPipe } from './pipes/ensure-https.pipe';
+import { UserFollowsComponent } from './components/stream/user-follows/user-follows.component';
 
 
 const routes: Routes = [
@@ -148,7 +149,8 @@ const routes: Routes = [
         NotificationComponent,
         BookmarksComponent,
         AttachementImageComponent,
-        EnsureHttpsPipe
+        EnsureHttpsPipe,
+        UserFollowsComponent
     ],
     entryComponents: [
         EmojiPickerComponent
diff --git a/src/app/components/stream/stream-overlay/stream-overlay.component.html b/src/app/components/stream/stream-overlay/stream-overlay.component.html
index dcb02f76..0ced8ea6 100644
--- a/src/app/components/stream/stream-overlay/stream-overlay.component.html
+++ b/src/app/components/stream/stream-overlay/stream-overlay.component.html
@@ -31,7 +31,16 @@
             class="overlay__content" 
             (browseAccountEvent)="browseAccount($event)"
             (browseHashtagEvent)="browseHashtag($event)" 
-            (browseThreadEvent)="browseThread($event)"></app-user-profile>
+            (browseThreadEvent)="browseThread($event)"
+            (browseFollowsEvent)="browseFollows($event)"
+            (browseFollowersEvent)="browseFollowers($event)"></app-user-profile>
+        <app-user-follows *ngIf="e.type === 'follows' || e.type === 'followers'"
+            [currentAccount]="e.account"
+            [type]="e.type"
+            [refreshEventEmitter]="e.refreshEventEmitter"
+            [goToTopEventEmitter]="e.goToTopEventEmitter"
+            class="overlay__content"
+            (browseAccountEvent)="browseAccount($event)"></app-user-follows>
         <app-hashtag #appHashtag *ngIf="e.type === 'hashtag'" 
             [hashtagElement]="e.hashtag"
             [refreshEventEmitter]="e.refreshEventEmitter"
diff --git a/src/app/components/stream/stream-overlay/stream-overlay.component.ts b/src/app/components/stream/stream-overlay/stream-overlay.component.ts
index e224d30b..b628ac58 100644
--- a/src/app/components/stream/stream-overlay/stream-overlay.component.ts
+++ b/src/app/components/stream/stream-overlay/stream-overlay.component.ts
@@ -123,7 +123,7 @@ export class StreamOverlayComponent implements OnInit, OnDestroy {
     browseAccount(accountName: string): void {
         if (!accountName) return;
 
-        const newElement = new OverlayBrowsing(null, accountName, null);
+        const newElement = new OverlayBrowsing('account', null, accountName, null);
         this.loadElement(newElement);
     }
 
@@ -132,14 +132,28 @@ export class StreamOverlayComponent implements OnInit, OnDestroy {
 
         const selectedAccount = this.toolsService.getSelectedAccounts()[0];
         const hashTagElement = new StreamElement(StreamTypeEnum.tag, hashtag, selectedAccount.id, hashtag, null, null, selectedAccount.instance);
-        const newElement = new OverlayBrowsing(hashTagElement, null, null);
+        const newElement = new OverlayBrowsing('hashtag', hashTagElement, null, null);
         this.loadElement(newElement);
     }
 
     browseThread(openThread: OpenThreadEvent): any {
         if (!openThread) return;
 
-        const newElement = new OverlayBrowsing(null, null, openThread);
+        const newElement = new OverlayBrowsing('thread', null, null, openThread);
+        this.loadElement(newElement);
+    }
+
+    browseFollows(accountName: string): void {
+        if (!accountName) return;
+
+        const newElement = new OverlayBrowsing('follows', null, accountName, null);
+        this.loadElement(newElement);
+    }
+
+    browseFollowers(accountName: string): void {
+        if (!accountName) return;
+
+        const newElement = new OverlayBrowsing('followers', null, accountName, null);
         this.loadElement(newElement);
     }
 
@@ -167,19 +181,10 @@ class OverlayBrowsing {
     goToTopEventEmitter = new EventEmitter();
 
     constructor(
+        public readonly type: 'hashtag' | 'account' | 'thread' | 'follows' | 'followers',
         public readonly hashtag: StreamElement,
         public readonly account: string,
         public readonly thread: OpenThreadEvent) {
-
-        if (hashtag) {
-            this.type = 'hashtag';
-        } else if (account) {
-            this.type = 'account';
-        } else if (thread) {
-            this.type = 'thread';
-        } else {
-            throw Error('NotImplemented');
-        }
     }
 
     show(): any {
@@ -198,5 +203,4 @@ class OverlayBrowsing {
     }
 
     isVisible: boolean;
-    type: 'hashtag' | 'account' | 'thread';
 }
diff --git a/src/app/components/stream/user-follows/user-follows.component.html b/src/app/components/stream/user-follows/user-follows.component.html
new file mode 100644
index 00000000..57a86440
--- /dev/null
+++ b/src/app/components/stream/user-follows/user-follows.component.html
@@ -0,0 +1,3 @@
+<p>
+  user-follows works!
+</p>
diff --git a/src/app/components/stream/user-follows/user-follows.component.scss b/src/app/components/stream/user-follows/user-follows.component.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/components/stream/user-follows/user-follows.component.spec.ts b/src/app/components/stream/user-follows/user-follows.component.spec.ts
new file mode 100644
index 00000000..d939b6f5
--- /dev/null
+++ b/src/app/components/stream/user-follows/user-follows.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserFollowsComponent } from './user-follows.component';
+
+xdescribe('UserFollowsComponent', () => {
+  let component: UserFollowsComponent;
+  let fixture: ComponentFixture<UserFollowsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ UserFollowsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(UserFollowsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/components/stream/user-follows/user-follows.component.ts b/src/app/components/stream/user-follows/user-follows.component.ts
new file mode 100644
index 00000000..83daf842
--- /dev/null
+++ b/src/app/components/stream/user-follows/user-follows.component.ts
@@ -0,0 +1,81 @@
+import { Component, OnInit, Input, EventEmitter, Output, OnDestroy, ViewChild, ElementRef } from '@angular/core';
+import { Subscription } from 'rxjs';
+
+@Component({
+    selector: 'app-user-follows',
+    templateUrl: './user-follows.component.html',
+    styleUrls: ['./user-follows.component.scss']
+})
+export class UserFollowsComponent implements OnInit, OnDestroy {
+
+    private _type: string;
+    private _currentAccount: string;
+
+    @Input('type')
+    set setType(type: string) {
+        this._type = type;
+        this.load(this._type, this._currentAccount);
+    }
+    get setType(): string {
+        return this._type;
+    }
+
+    @Input('currentAccount')
+    set currentAccount(accountName: string) {
+        this._currentAccount = accountName;
+        this.load(this._type, this._currentAccount);
+    }
+    get currentAccount(): string {
+        return this._currentAccount;
+    }
+
+    @Input() refreshEventEmitter: EventEmitter<any>;
+    @Input() goToTopEventEmitter: EventEmitter<any>;
+
+    @Output() browseAccountEvent = new EventEmitter<string>();
+
+    @ViewChild('statusstream') public statustream: ElementRef;
+
+    private refreshSubscription: Subscription;
+    private goToTopSubscription: Subscription;
+
+    constructor() { }
+ 
+    ngOnInit() {
+        if (this.refreshEventEmitter) {
+            this.refreshSubscription = this.refreshEventEmitter.subscribe(() => {
+                this.refresh();
+            })
+        }
+
+        if (this.goToTopEventEmitter) {
+            this.goToTopSubscription = this.goToTopEventEmitter.subscribe(() => {
+                this.goToTop();
+            })
+        }
+    }
+
+    ngOnDestroy(): void {
+        if (this.refreshSubscription) this.refreshSubscription.unsubscribe();
+        if (this.goToTopSubscription) this.goToTopSubscription.unsubscribe();
+    }
+
+    private load(type: string, accountName: string) {
+        if (type && accountName) {
+            console.warn(`type: ${type} account ${accountName}`);
+        }
+    }
+
+    refresh(): any {
+    }
+
+    goToTop(): any {
+        const stream = this.statustream.nativeElement as HTMLElement;
+        setTimeout(() => {
+            stream.scrollTo({
+                top: 0,
+                behavior: 'smooth'
+            });
+        }, 0);
+    }
+}
diff --git a/src/app/components/stream/user-profile/user-profile.component.html b/src/app/components/stream/user-profile/user-profile.component.html
index 55ff8424..a0796d87 100644
--- a/src/app/components/stream/user-profile/user-profile.component.html
+++ b/src/app/components/stream/user-profile/user-profile.component.html
@@ -121,6 +121,11 @@
                             target="_blank" title="{{displayedAccount.acct}}">@{{displayedAccount.acct}}</a></h2>
                 </div>
 
+                <div class="profile-follows">
+                    <a href class="profile-follows__link" title="show follows" (click)="browseFollows()" >Follows</a>
+                    <a href class="profile-follows__link" title="show followers" (click)="browseFollowers()">Followers</a>
+                </div>
+
                 <!-- <div class="profile__extra-info">
                     <div class="profile__extra-info__section">
                         <a href class="profile__extra-info__links" 
diff --git a/src/app/components/stream/user-profile/user-profile.component.scss b/src/app/components/stream/user-profile/user-profile.component.scss
index 09cb7890..30bc1fb7 100644
--- a/src/app/components/stream/user-profile/user-profile.component.scss
+++ b/src/app/components/stream/user-profile/user-profile.component.scss
@@ -15,7 +15,7 @@ $floating-header-height: 60px;
     position: relative;
 }
 
-.profile {    
+.profile {
     // overflow: auto;
     height: calc(100%);
     // width: $stream-column-width;
@@ -175,7 +175,8 @@ $floating-header-height: 60px;
                 display: inline-block;
                 transition: all .2s;
                 color: white;
-                &:hover{
+
+                &:hover {
                     color: rgb(216, 216, 216);
                 }
             }
@@ -188,7 +189,7 @@ $floating-header-height: 60px;
                 color: #5fbcff;
                 color: #85ccff;
 
-                &:hover{
+                &:hover {
                     color: #85ccff;
                     color: #38abff;
                 }
@@ -212,7 +213,7 @@ $floating-header-height: 60px;
             font-size: 12px;
             // max-width: 150px;
             width: 265px;
-            
+
             //outline: 1px solid greenyellow;
 
             &--data {
@@ -221,7 +222,7 @@ $floating-header-height: 60px;
                 padding: 4px 10px;
                 border-radius: 4px;
                 text-align: center;
-                margin: 0 2px 2px 0; 
+                margin: 0 2px 2px 0;
             }
         }
 
@@ -252,7 +253,7 @@ $floating-header-height: 60px;
             overflow: hidden;
             margin: 0;
 
-            &:not(:last-child){
+            &:not(:last-child) {
                 margin-bottom: 3px;
             }
         }
@@ -271,6 +272,27 @@ $floating-header-height: 60px;
         }
     }
 
+    &-follows {
+        width: calc(100%);  
+        font-size: 13px;     
+        transition: all .7s;
+        border-bottom: 1px solid #0f111a;;
+
+        &__link {
+            color: white;
+            width: calc(50%);
+            padding: 5px;
+            text-align: center;
+            display: inline-block;
+            background-color: #1a1f2e;
+
+            &:hover {
+                text-decoration: none;
+                background-color: #131722;
+            }
+        }
+    }
+
     &-description {
         padding: 9px 10px 15px 10px;
         font-size: 13px;
@@ -360,7 +382,7 @@ $floating-header-height: 60px;
     }
 
     &__status-switching-section {
-        height: calc(100vh - 35px - #{$floating-header-height} - #{$stream-header-height} - #{$stream-selector-height});        
+        height: calc(100vh - 35px - #{$floating-header-height} - #{$stream-header-height} - #{$stream-selector-height});
     }
 
     &-no-toots {
diff --git a/src/app/components/stream/user-profile/user-profile.component.ts b/src/app/components/stream/user-profile/user-profile.component.ts
index 06049fbd..8b613382 100644
--- a/src/app/components/stream/user-profile/user-profile.component.ts
+++ b/src/app/components/stream/user-profile/user-profile.component.ts
@@ -418,4 +418,19 @@ export class UserProfileComponent extends BrowseBase {
         this.navigationService.openMedia(openMediaEvent);
         return false;
     }
+
+    @Output() browseFollowsEvent = new EventEmitter<string>();
+    @Output() browseFollowersEvent = new EventEmitter<string>();
+
+    browseFollows(): boolean {
+        let accountName = this.toolsService.getAccountFullHandle(this.displayedAccount);
+        this.browseFollowsEvent.next(accountName);
+        return false;
+    }
+
+    browseFollowers(): boolean {
+        let accountName = this.toolsService.getAccountFullHandle(this.displayedAccount);
+        this.browseFollowersEvent.next(accountName);
+        return false;
+    }
 }