diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.component.html b/apps/mina-sidor-fa/src/app/pages/start/start.component.html
index af66658..dfe6c20 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.component.html
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.component.html
@@ -25,6 +25,8 @@
               innehåll, förbättringar och uppdateringar.
             </p>
             <p>Målet är helt enkelt att underlätta ditt dagliga arbete!</p>
+
+            <msfa-news></msfa-news>
           </ng-container>
           <ng-template #unauthorizedRef>
             <p>
diff --git a/apps/mina-sidor-fa/src/app/pages/start/start.module.ts b/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
index 81a2bbe..3c7d87c 100644
--- a/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
+++ b/apps/mina-sidor-fa/src/app/pages/start/start.module.ts
@@ -3,6 +3,7 @@ import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { LayoutModule } from '@msfa-shared/components/layout/layout.module';
+import { NewsModule } from '@msfa-shared/components/nyheter/news.module';
 import { UiLoaderModule } from '@ui/loader/loader.module';
 import { StartComponent } from './start.component';
 
@@ -15,6 +16,7 @@ import { StartComponent } from './start.component';
     LayoutModule,
     DigiNgCardModule,
     UiLoaderModule,
+    NewsModule
   ],
 })
 export class StartModule {}
diff --git a/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.html b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.html
new file mode 100644
index 0000000..081f728
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.html
@@ -0,0 +1,6 @@
+<ng-container *ngIf="newsData$ | async as news">
+  <h1>{{news.title}}</h1>
+  <hr />
+  <div [innerHtml]="news.body"></div>
+</ng-container>
+<ui-loader *ngIf="newsLoading$ | async" uiType="padded"></ui-loader>
diff --git a/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.scss b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.scss
new file mode 100644
index 0000000..6a3f6d8
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.scss
@@ -0,0 +1,5 @@
+@import 'variables/gutters';
+
+h1 {
+  margin-top: $digi--layout--gutter--xl;
+}
diff --git a/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.spec.ts b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.spec.ts
new file mode 100644
index 0000000..aa0159b
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.spec.ts
@@ -0,0 +1,22 @@
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NewsComponent } from './news.component';
+describe('NewsComponent', () => {
+  let component: NewsComponent;
+  let fixture: ComponentFixture<NewsComponent>;
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+      declarations: [NewsComponent]
+    })
+      .compileComponents();
+  });
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NewsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.ts b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.ts
new file mode 100644
index 0000000..82dc79b
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.component.ts
@@ -0,0 +1,17 @@
+import { Component } from '@angular/core';
+import { News } from '@msfa-models/news.model';
+import { NewsApiService } from '@msfa-services/api/news.api.service';
+import { Observable } from 'rxjs';
+
+@Component({
+  selector: 'msfa-news',
+  templateUrl: 'news.component.html',
+  styleUrls: ['news.component.scss']
+})
+export class NewsComponent {
+  newsData$: Observable<News> = this.newsApiService.fetchNews$();
+  newsLoading$: Observable<boolean> = this.newsApiService.newsLoading$;
+
+  constructor(private newsApiService: NewsApiService) { }
+
+}
diff --git a/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.module.ts b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.module.ts
new file mode 100644
index 0000000..caa9ace
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/components/nyheter/news.module.ts
@@ -0,0 +1,14 @@
+import { CommonModule } from '@angular/common';
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
+import { UiLoaderModule } from '@ui/loader/loader.module';
+import { NewsComponent } from './news.component';
+
+@NgModule({
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  declarations: [NewsComponent],
+  imports: [CommonModule, UiLoaderModule],
+  exports: [NewsComponent]
+})
+export class NewsModule {
+
+}
diff --git a/apps/mina-sidor-fa/src/app/shared/models/api/news.response.model.ts b/apps/mina-sidor-fa/src/app/shared/models/api/news.response.model.ts
new file mode 100644
index 0000000..4aa81a4
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/models/api/news.response.model.ts
@@ -0,0 +1,8 @@
+export interface NewsResponse {
+  body: {
+    view: {
+      value: string;
+    }
+  };
+  title: string;
+}
diff --git a/apps/mina-sidor-fa/src/app/shared/models/news.model.ts b/apps/mina-sidor-fa/src/app/shared/models/news.model.ts
new file mode 100644
index 0000000..013b845
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/models/news.model.ts
@@ -0,0 +1,15 @@
+import { NewsResponse } from './api/news.response.model';
+
+export interface News {
+  title: string;
+  body: string;
+}
+
+export function mapNewsResponseToNews(data: NewsResponse): News {
+  const { body, title } = data;
+
+  return {
+    title: title,
+    body: body.view.value
+  }
+}
diff --git a/apps/mina-sidor-fa/src/app/shared/services/api/news.api.service.ts b/apps/mina-sidor-fa/src/app/shared/services/api/news.api.service.ts
new file mode 100644
index 0000000..d216ccc
--- /dev/null
+++ b/apps/mina-sidor-fa/src/app/shared/services/api/news.api.service.ts
@@ -0,0 +1,37 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { environment } from '@msfa-environment';
+import { NewsResponse } from '@msfa-models/api/news.response.model';
+import { errorToCustomError } from '@msfa-models/error/custom-error';
+import { mapNewsResponseToNews, News } from '@msfa-models/news.model';
+import { ErrorService } from '@msfa-services/error.service';
+import { BehaviorSubject, Observable, throwError } from 'rxjs';
+import { catchError, filter, map } from 'rxjs/operators';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class NewsApiService {
+  private _apiBaseUrl = `${environment.api.url}/confluence/nyheter`;
+  private _newsLoading$ = new BehaviorSubject<boolean>(false);
+  public newsLoading$: Observable<boolean> = this._newsLoading$.asObservable();
+
+  constructor(private http: HttpClient, private errorService: ErrorService) { }
+
+  public fetchNews$(): Observable<News> {
+    this._newsLoading$.next(true);
+
+    return this.http.get<NewsResponse>(this._apiBaseUrl).pipe(
+      filter(response => !!response),
+      map(response => {
+        this._newsLoading$.next(false);
+        return mapNewsResponseToNews(response['data']);
+      }),
+      catchError((error: Error) => {
+        this.errorService.add(errorToCustomError({ ...error, message: `Kunde inte hämta nyheter.\n\n${error.message}` }));
+        return throwError(errorToCustomError(error));
+      })
+    );
+  }
+
+}