diff --git a/src/app/_dialogs/open-file-dialog/open-file-dialog.component.html b/src/app/_dialogs/open-file-dialog/open-file-dialog.component.html
index 27a3bb4..0e266e9 100644
--- a/src/app/_dialogs/open-file-dialog/open-file-dialog.component.html
+++ b/src/app/_dialogs/open-file-dialog/open-file-dialog.component.html
@@ -2,6 +2,7 @@
   <ng-container *ngIf="!mode">Where is your file?</ng-container>
   <ng-container *ngIf="mode === 'local'">Upload a local {{fileTypesString()}} file</ng-container>
   <ng-container *ngIf="mode === 'remote'">Open a {{fileTypesString()}} file from URL</ng-container>
+  <ng-container *ngIf="mode === 'reference'">Upload a new reference file ({{fileTypes}})</ng-container>
   <span fxFlex></span>
   <button mat-icon-button mat-dialog-close=""><mat-icon>close</mat-icon></button>
 </div>
@@ -28,6 +29,17 @@
     <button (click)="cancel()" mat-flat-button>Cancel</button>
   </div>
 
+  <div *ngIf="mode === 'reference'">
+    <mat-form-field (click)="fileInput.click()">
+      <span matPrefix><mat-icon>folder_open</mat-icon> &nbsp;</span>
+      <input [value]="getFileName()" disabled matInput type="text">
+    </mat-form-field>
+    <input #fileInput (change)="onFileSelected($event)" accept="{{fileExtensions()}}" hidden id="file"
+           type="file">
+    <button (click)="onSubmit()" [disabled]="!data.file" color="primary" mat-flat-button>Upload File</button>
+    <button (click)="cancel()" mat-flat-button>Cancel</button>
+  </div>
+
   <div *ngIf="mode === 'remote'">
     <mat-form-field>
       <span matPrefix><mat-icon>link</mat-icon> &nbsp;</span>
diff --git a/src/app/reference-files/reference-files.component.html b/src/app/reference-files/reference-files.component.html
index 17b8eee..e43845e 100644
--- a/src/app/reference-files/reference-files.component.html
+++ b/src/app/reference-files/reference-files.component.html
@@ -1,5 +1,10 @@
 <div class="container" fxLayout="column" fxLayoutGap="40px">
-  <h1>Reference Files</h1>
+  <div class="top-bar" fxLayout="row" fxLayoutGap="75px">
+    <h1>Reference Files</h1>
+    <button mat-button color="accent" (click)="addNewReferenceFile()">
+      <mat-icon>file_upload</mat-icon> Add new Reference File
+    </button>
+  </div>
 
   <div *ngFor="let refFile of referenceFiles" fxLayout="row" fxLayoutGap="40px">
     <mat-card class="mat-elevation-z0">
diff --git a/src/app/reference-files/reference-files.component.scss b/src/app/reference-files/reference-files.component.scss
index 34180cc..6770ce5 100644
--- a/src/app/reference-files/reference-files.component.scss
+++ b/src/app/reference-files/reference-files.component.scss
@@ -1,5 +1,10 @@
 @import "../../config";
 
+.top-bar {
+  padding-top: 1em;
+  margin-bottom: 1em;
+}
+
 mat-card {
   padding: 2em;
   border: 1px solid $brand-gray;
diff --git a/src/app/reference-files/reference-files.component.ts b/src/app/reference-files/reference-files.component.ts
index 7936b28..512bc1f 100644
--- a/src/app/reference-files/reference-files.component.ts
+++ b/src/app/reference-files/reference-files.component.ts
@@ -2,7 +2,7 @@ import {Component} from '@angular/core';
 import {MatDialog} from '@angular/material/dialog';
 import {MatSnackBar} from '@angular/material/snack-bar';
 import * as fileSaver from 'file-saver';
-import {ApiService, FileMeta, FileType} from 'sartography-workflow-lib';
+import {ApiService, FileMeta, FileParams, FileType, getFileType, isNumberDefined} from 'sartography-workflow-lib';
 import {OpenFileDialogComponent} from '../_dialogs/open-file-dialog/open-file-dialog.component';
 import {OpenFileDialogData} from '../_interfaces/dialog-data';
 
@@ -56,4 +56,32 @@ export class ReferenceFilesComponent {
       fileSaver.saveAs(blob, fm.name);
     });
   }
+
+  addNewReferenceFile(fm?: FileMeta, file?: File) {
+    const dialogData: OpenFileDialogData = {
+      fileMetaId: fm ? fm.id : undefined,
+      file,
+      mode: 'reference',
+      fileTypes: [FileType.DOC, FileType.DOCX, FileType.XLSX, FileType.XLS],
+    };
+    const dialogRef = this.dialog.open(OpenFileDialogComponent, {data: dialogData});
+
+    dialogRef.afterClosed().subscribe((data: OpenFileDialogData) => {
+      if (data && data.file) {
+        const newFileMeta: FileMeta = {
+          id: data.fileMetaId,
+          content_type: data.file.type,
+          name: data.file.name,
+          type: getFileType(data.file),
+          is_reference: true,
+        };
+        const fileParams = {};
+        this.apiService.addFile(fileParams, newFileMeta, data.file).subscribe(refs => {
+          this.snackBar.open(`Added new file ${fm.name}.`, 'Ok', {duration: 3000});
+            this._loadReferenceFiles();
+          }
+        )
+      }
+    });
+  }
 }