Added some colors

src/app/app.component.html

@@ -5,7 +5,8 @@
     <small *ngIf="timer" class="text-muted">{{timer}} microseconds to upload</small>
     <span class="mx-auto"><!-- Spacer --></span>
     <mat-chip-list class="mr-2">
-        <mat-chip *ngFor="let file of fileNames" color="primary" [removable]="true" (removed)="remove($event.chip.value)" [value]="file">
+        <mat-chip *ngFor="let file of fileNames; let i = index" class="text-white" [style.backgroundColor]="colorScheme.domain[i]"
+                  [removable]="true" (removed)="remove($event.chip.value)" [value]="file">
             {{file}}
             <mat-icon matChipRemove>cancel</mat-icon>
         </mat-chip>
@@ -19,6 +20,7 @@
 <img *ngIf="!chartResults" class="float-right mt-2 mr-5" src="assets/starthere.png">
 <div *ngIf="chartResults" class="w-100" [style.height]="chartHeight">
     <ngx-charts-bar-horizontal-2d #chart
+                                  [scheme]="colorScheme"
                                   [results]="chartResults"
                                   [xAxis]="true"
                                   [yAxis]="true"

src/app/app.component.ts

@@ -1,11 +1,13 @@
 import {Component} from '@angular/core';
 import {timer} from './timer';
+import {colorScheme} from './colorScheme';
 
 @Component({
     selector: 'app-root',
     templateUrl: './app.component.html'
 })
 export class AppComponent {
+    colorScheme = colorScheme; // colors
     chartResults; // This is where the chart reads the data from
     chartHeight = '100%'; // Dynamic height for chart
     timer = window['timer']; // Async pipe to display the timed data

src/app/colorScheme.ts

@@ -0,0 +1,6 @@
+export const colorScheme = {
+    name: 'cool',
+    selectable: true,
+    group: 'Ordinal',
+    domain: ['#a8385d', '#7aa3e5', '#a27ea8', '#aae3f5', '#adcded', '#a95963', '#8796c0', '#7ed3ed', '#50abcc', '#ad6886']
+};