diff --git a/src/FilterLists.Services/FilterList/MappingProfiles/ListTagDtoMappingProfile.cs b/src/FilterLists.Services/FilterList/MappingProfiles/ListTagDtoMappingProfile.cs
new file mode 100644
index 000000000..5925950c8
--- /dev/null
+++ b/src/FilterLists.Services/FilterList/MappingProfiles/ListTagDtoMappingProfile.cs
@@ -0,0 +1,14 @@
+using AutoMapper;
+using FilterLists.Data.Entities;
+using FilterLists.Services.FilterList.Models;
+using JetBrains.Annotations;
+
+namespace FilterLists.Services.FilterList.MappingProfiles
+{
+    [UsedImplicitly]
+    public class ListTagDtoMappingProfile : Profile
+    {
+        public ListTagDtoMappingProfile() =>
+            CreateMap<Tag, ListTagDto>().ForMember(d => d.ColorHex, c => c.MapFrom(m => TagColors.Colors[(int)m.Id]));
+    }
+}
\ No newline at end of file
diff --git a/src/FilterLists.Services/FilterList/Models/ListTagDto.cs b/src/FilterLists.Services/FilterList/Models/ListTagDto.cs
index fdad8692d..f2f1843be 100644
--- a/src/FilterLists.Services/FilterList/Models/ListTagDto.cs
+++ b/src/FilterLists.Services/FilterList/Models/ListTagDto.cs
@@ -6,6 +6,7 @@ namespace FilterLists.Services.FilterList.Models
     public class ListTagDto
     {
         public string Name { get; set; }
+        public string ColorHex { get; set; }
         public string Description { get; set; }
     }
 }
\ No newline at end of file
diff --git a/src/FilterLists.Services/FilterList/TagColors.cs b/src/FilterLists.Services/FilterList/TagColors.cs
new file mode 100644
index 000000000..1e6c5e8f3
--- /dev/null
+++ b/src/FilterLists.Services/FilterList/TagColors.cs
@@ -0,0 +1,33 @@
+using System.Collections.Generic;
+using System.Collections.ObjectModel;
+
+namespace FilterLists.Services.FilterList
+{
+    public static class TagColors
+    {
+        //https://stackoverflow.com/a/4382138/2343739
+        public static readonly IList<string> Colors = new ReadOnlyCollection<string>(new List<string>
+        {
+            "FFB300", // Vivid Yellow
+            "803E75", // Strong Purple
+            "FF6800", // Vivid Orange
+            "A6BDD7", // Very Light Blue
+            "C10020", // Vivid Red
+            "CEA262", // Grayish Yellow
+            "817066", // Medium Gray
+            "007D34", // Vivid Green
+            "F6768E", // Strong Purplish Pink
+            "00538A", // Strong Blue
+            "FF7A5C", // Strong Yellowish Pink
+            "53377A", // Strong Violet
+            "FF8E00", // Vivid Orange Yellow
+            "B32851", // Strong Purplish Red
+            "F4C800", // Vivid Greenish Yellow
+            "7F180D", // Strong Reddish Brown
+            "93AA00", // Vivid Yellowish Green
+            "593315", // Deep Yellowish Brown
+            "F13A13", // Vivid Reddish Orange
+            "232C16" // Dark Olive Green
+        });
+    }
+}
\ No newline at end of file
diff --git a/src/FilterLists.Web/ClientApp/components/Home.tsx b/src/FilterLists.Web/ClientApp/components/Home.tsx
index ea23beadc..70744b6c2 100644
--- a/src/FilterLists.Web/ClientApp/components/Home.tsx
+++ b/src/FilterLists.Web/ClientApp/components/Home.tsx
@@ -99,9 +99,7 @@ export class Home extends React.Component<RouteComponentProps<{}>, IHomeState> {
                            filterMethod: (filter: any, row: any) => row[filter.id].map((e: any) => e.name).join()
                                .toUpperCase().includes(filter.value.toUpperCase()),
                            sortMethod: (a: any, b: any) => a.join().toUpperCase() > b.join().toUpperCase() ? 1 : -1,
-                           Cell: (cell: any) => <div>{cell.value.map(
-                               (e: any) => <span className="badge badge-warning" title={e.description}>{e.name}</span>)
-                           }</div>,
+                           Cell: (cell: any) => <div>{cell.value.map((e: any) => <span className="badge" style={{ backgroundColor: `#${e.colorHex}` }} title={e.description}>{e.name}</span>)}</div>,
                            width: 100,
                            headerClassName: "d-none d-lg-block",
                            className: "d-none d-lg-block"
@@ -193,6 +191,7 @@ interface IListLanguageDto {
 
 interface IListTagDto {
     name: string;
+    colorHex: string;
     description: string;
 }
 
diff --git a/src/FilterLists.Web/FilterLists.Web.csproj b/src/FilterLists.Web/FilterLists.Web.csproj
index 36cfe24c2..94d80fc74 100644
--- a/src/FilterLists.Web/FilterLists.Web.csproj
+++ b/src/FilterLists.Web/FilterLists.Web.csproj
@@ -70,7 +70,7 @@
   </Target>
 
   <Target Name="PreBuild" BeforeTargets="PreBuildEvent">
-    <!--<Exec Command="if $(ConfigurationName) == Debug call &quot;$(SolutionDir)scripts\npm_webpack_win.bat&quot;" />-->
+    <Exec Command="if $(ConfigurationName) == Debug call &quot;$(SolutionDir)scripts\npm_webpack_win.bat&quot;" />
   </Target>
 
 </Project>
\ No newline at end of file