export html table to excel with css in angular

问题:

I am trying to export HTML table to excel with applied CSS.I am using xlsx library for it, but the issue I'm facing is it ain't exporting the table with CSS styles. How do I get it to carry the CSS style, based on this thread I am applying inline CSS to the table elements.

HTML

  <table #table>
    <thead>
    <tr>
    <th>Color
    <th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let item of copy;index as i">
    <td [style.color]="colors[i]">
    {{item}}
    </td>
    </tr>
    </tbody>
    </table>
    <button type="button" (click)="fireEvent()">Export</button>

Component

export class AppComponent  {
  @ViewChild('table') table: ElementRef;

colors=['Red','Green','Blue','Orange','Violet'];



fireEvent()
{
  const ws: XLSX.WorkSheet=XLSX.utils.table_to_sheet(this.table.nativeElement);
  const wb: XLSX.WorkBook = XLSX.utils.book_new();
  XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');

  /* save to file */
  XLSX.writeFile(wb, 'SheetJS.xlsx');

}
}

I tried using xlsx-style library which proclaims to preserve CSS styles and tried this thread but all in vain.what could be the workaround?

DEMO