diff --git a/src/app/answer-statistics/answer-statistics.component.html b/src/app/answer-statistics/answer-statistics.component.html
index d6571e24a166330cc81fc5959db3be8e7ffeab5d..a8dd5151c831ad1f877b3b041782d6a868854740 100644
--- a/src/app/answer-statistics/answer-statistics.component.html
+++ b/src/app/answer-statistics/answer-statistics.component.html
@@ -1,4 +1,20 @@
-<mat-card>
-  <mat-progress-bar [value]="50">
-  </mat-progress-bar>
-</mat-card>
+<div fxLayout="row" fxLayoutAlign="center">
+  <div fxLayout="column" fxLayoutGap="20px">
+    <mat-card>
+      <mat-tab-group>
+        <mat-tab label="Answer statistic">
+          <mat-select placeholder="Answers" fxLayoutAlign="right">
+            <mat-option *ngFor="let state of states" [value]="state.value">
+              {{ state.value }}
+            </mat-option>
+          </mat-select>
+          <div class="bars">
+            Answer 1
+            <mat-progress-bar [value]="50" #col *ngIf="state.value === 'Responded' :">
+            </mat-progress-bar>
+          </div>
+        </mat-tab>
+      </mat-tab-group>
+    </mat-card>
+  </div>
+</div>
diff --git a/src/app/answer-statistics/answer-statistics.component.scss b/src/app/answer-statistics/answer-statistics.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..26bb809a01cc727273c3786c05c9ea0781b173f7 100644
--- a/src/app/answer-statistics/answer-statistics.component.scss
+++ b/src/app/answer-statistics/answer-statistics.component.scss
@@ -0,0 +1,14 @@
+mat-card {
+  min-width: 800px;
+  justify-content: center;
+}
+
+mat-select {
+  max-width: 100px;
+  margin-top: 10px;
+  margin-left: 675px;
+}
+
+.bars {
+  margin-top: 20px;
+}
diff --git a/src/app/answer-statistics/answer-statistics.component.ts b/src/app/answer-statistics/answer-statistics.component.ts
index 4673b5ee2a07f181c5c289ac1662840c34e70166..07af3178d6c5f2b0b62d18d667ad38a5c676fb46 100644
--- a/src/app/answer-statistics/answer-statistics.component.ts
+++ b/src/app/answer-statistics/answer-statistics.component.ts
@@ -6,6 +6,10 @@ import { Component, OnInit } from '@angular/core';
   styleUrls: ['./answer-statistics.component.scss']
 })
 export class AnswerStatisticsComponent implements OnInit {
+  states = [
+    { value: '1', viewValue: 'Responded' },
+    { value: '2', viewValue: 'Not responded' },
+  ];
 
   constructor() { }