diff --git a/projects/plotly/src/lib/plotly.component.spec.ts b/projects/plotly/src/lib/plotly.component.spec.ts
index ca0d142..d7819b1 100644
--- a/projects/plotly/src/lib/plotly.component.spec.ts
+++ b/projects/plotly/src/lib/plotly.component.spec.ts
@@ -216,4 +216,30 @@ describe('PlotlyComponent', () => {
 
         expect(PlotlyJS.Plots.resize).not.toHaveBeenCalled();
     });
+
+    it('should load a theme', async () => {
+        spyOn(component, 'loadTheme').and.callThrough();
+        spyOn(component.themeLoader, 'load').and.callThrough();
+
+        component.theme = 'plotly_dark';
+
+        component.ngOnInit();
+        await fixture.whenStable();
+
+        expect(component.loadTheme).toHaveBeenCalled();
+        expect(component.themeLoader.load).toHaveBeenCalledOnceWith('plotly_dark');
+    });
+
+    it('should load NOT a theme', async () => {
+        spyOn(component, 'loadTheme').and.callThrough();
+        spyOn(component.themeLoader, 'load').and.callThrough();
+
+        component.theme = 'none';
+
+        component.ngOnInit();
+        await fixture.whenStable();
+
+        expect(component.loadTheme).not.toHaveBeenCalled();
+        expect(component.themeLoader.load).not.toHaveBeenCalledOnceWith('plotly_dark');
+    });
 });
diff --git a/projects/plotly/src/lib/plotly.component.ts b/projects/plotly/src/lib/plotly.component.ts
index 6fb6fda..b2f3dbe 100644
--- a/projects/plotly/src/lib/plotly.component.ts
+++ b/projects/plotly/src/lib/plotly.component.ts
@@ -20,6 +20,7 @@ import {
 } from '@angular/core';
 
 import { PlotlyService } from './plotly.service';
+import { PlotlyThemeLoaderService, PlotlyTheme } from './plotly.theme-loader.service';
 import { Plotly } from './plotly.interface';
 
 // @dynamic
@@ -45,6 +46,7 @@ export class PlotlyComponent implements OnInit, OnChanges, OnDestroy, DoCheck {
     @Input() config?: Partial<Plotly.Config>;
     @Input() frames?: Partial<Plotly.Config>[];
     @Input() style?: { [key: string]: string };
+    @Input() theme: PlotlyTheme = "none";
 
     @Input() divId?: string;
     @Input() revision = 0;
@@ -115,6 +117,7 @@ export class PlotlyComponent implements OnInit, OnChanges, OnDestroy, DoCheck {
 
     constructor(
         public plotly: PlotlyService,
+        public themeLoader: PlotlyThemeLoaderService,
         public iterableDiffers: IterableDiffers,
         public keyValueDiffers: KeyValueDiffers,
     ) { }
@@ -130,6 +133,8 @@ export class PlotlyComponent implements OnInit, OnChanges, OnDestroy, DoCheck {
                 + 'Please check https://github.com/plotly/angular-plotly.js#FAQ';
             console.error(msg);
         }
+
+        if (this.theme != 'none') this.loadTheme();
     }
 
     ngOnDestroy(): void {
@@ -291,4 +296,13 @@ export class PlotlyComponent implements OnInit, OnChanges, OnDestroy, DoCheck {
         const obj = Object.assign({}, item, { uid: '' });
         return JSON.stringify(obj);
     }
+
+    loadTheme() {
+        if (this.layout !== undefined) {
+            const msg = 'You fulfill both `theme` and `layout` properties. This will overwrite the `layout` data with the `theme` data.';
+            console.warn(msg);
+        }
+
+        this.themeLoader.load(this.theme).then(theme => this.layout = theme);
+    }
 }
diff --git a/projects/plotly/src/lib/plotly.service.ts b/projects/plotly/src/lib/plotly.service.ts
index f4b0537..c8ccc59 100644
--- a/projects/plotly/src/lib/plotly.service.ts
+++ b/projects/plotly/src/lib/plotly.service.ts
@@ -84,25 +84,25 @@ export class PlotlyService {
         await this.waitFor(() => this._getPlotly() !== 'waiting');
 
         if (frames) {
-            const obj = {data, layout, config, frames};
+            const obj = { data, layout, config, frames };
             return this._getPlotly().newPlot(div, obj).then(() => PlotlyService.insert(div as any)) as Promise<any>;
         }
 
         return this._getPlotly().newPlot(div, data, layout, config).then(() => PlotlyService.insert(div as any)) as Promise<any>;
     }
 
-    public plot(div: Plotly.PlotlyHTMLElement, data: Plotly.Data[], layout?: Partial<Plotly.Layout>, config?: Partial<Plotly.Config>, frames?: Partial<Plotly.Config>[]): Promise<any>  {
+    public plot(div: Plotly.PlotlyHTMLElement, data: Plotly.Data[], layout?: Partial<Plotly.Layout>, config?: Partial<Plotly.Config>, frames?: Partial<Plotly.Config>[]): Promise<any> {
         if (frames) {
-            const obj = {data, layout, config, frames};
+            const obj = { data, layout, config, frames };
             return this._getPlotly().newPlot(div, obj) as Promise<any>;
         }
 
         return this._getPlotly().newPlot(div, data, layout, config) as Promise<any>;
     }
 
-    public update(div: Plotly.PlotlyHTMLElement, data: Plotly.Data[], layout?: Partial<Plotly.Layout>, config?: Partial<Plotly.Config>, frames?: Partial<Plotly.Config>[]): Promise<any>  {
+    public update(div: Plotly.PlotlyHTMLElement, data: Plotly.Data[], layout?: Partial<Plotly.Layout>, config?: Partial<Plotly.Config>, frames?: Partial<Plotly.Config>[]): Promise<any> {
         if (frames) {
-            const obj = {data, layout, config, frames};
+            const obj = { data, layout, config, frames };
             return this._getPlotly().react(div, obj) as Promise<any>;
         }
 
diff --git a/projects/plotly/src/lib/plotly.theme-loader.service.spec.ts b/projects/plotly/src/lib/plotly.theme-loader.service.spec.ts
new file mode 100644
index 0000000..866f63c
--- /dev/null
+++ b/projects/plotly/src/lib/plotly.theme-loader.service.spec.ts
@@ -0,0 +1,61 @@
+import { TestBed, inject } from '@angular/core/testing';
+import { PlotlyThemeLoaderService } from './plotly.theme-loader.service';
+
+
+describe('PlotlyThemeLoaderService', () => {
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            providers: [PlotlyThemeLoaderService]
+        });
+    });
+
+    it("should load the ggplot2 theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('ggplot2');
+        expect(json.geo.lakecolor).toBe("white");
+    }));
+
+    it("should load the gridon theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('gridon');
+        expect(json.xaxis.title.standoff).toBe(15);
+    }));
+
+    it("should load the plotly_dark theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('plotly_dark');
+        expect(json.mapbox.style).toBe("dark");
+    }));
+
+    it("should load the plotly_white theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('plotly_white');
+        expect(json.mapbox.style).toBe("light");
+    }));
+
+    it("should load the plotly theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('plotly');
+        expect(json.mapbox.style).toBe("light");
+    }));
+
+    it("should load the presentation theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('presentation');
+        expect(json.xaxis.title.standoff).toBe(15);
+    }));
+
+    it("should load the seaborn theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('seaborn');
+        expect(json.colorway[2]).toBe('rgb(85,168,104)');
+    }));
+
+    it("should load the simple_white theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('simple_white');
+        expect(json.colorway[1]).toBe("#FF7F0E");
+    }));
+
+    it("should load the xgridoff theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('xgridoff');
+        expect(json.xaxis.title.standoff).toBe(15);
+    }));
+
+    it("should load the ygridoff theme", inject([PlotlyThemeLoaderService], async (service: PlotlyThemeLoaderService) => {
+        var json: any = await service.load('ygridoff');
+        expect(json.yaxis.showgrid).toBe(false);
+    }));
+});
\ No newline at end of file
diff --git a/projects/plotly/src/lib/plotly.theme-loader.service.ts b/projects/plotly/src/lib/plotly.theme-loader.service.ts
new file mode 100644
index 0000000..e0e0e59
--- /dev/null
+++ b/projects/plotly/src/lib/plotly.theme-loader.service.ts
@@ -0,0 +1,22 @@
+import { Injectable } from '@angular/core';
+
+export type PlotlyTheme = 'ggplot2' | 'seaborn' | 'simple_white' | 'plotly' | 'plotly_white' | 'plotly_dark' | 'presentation' | 'xgridoff' | 'ygridoff' | 'gridon' | 'none';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class PlotlyThemeLoaderService {
+
+    public get isLoading() { return this._isLoading; }
+    private _isLoading: boolean = false;
+
+    public load(themeName: PlotlyTheme): Promise<any> {
+        this._isLoading = true;
+        return new Promise(resolve => {
+            import(`./themes/${themeName}.json`).then(data => {
+                resolve(data);
+                this._isLoading = false;
+            });
+        });
+    }
+}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/ggplot2.json b/projects/plotly/src/lib/themes/ggplot2.json
new file mode 100644
index 0000000..c943bd5
--- /dev/null
+++ b/projects/plotly/src/lib/themes/ggplot2.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["#F8766D","#A3A500","#00BF7D","#00B0F6","#E76BF3"],"font":{"color":"rgb(51,51,51)"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"white","plot_bgcolor":"rgb(237,237,237)","polar":{"bgcolor":"rgb(237,237,237)","angularaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside"},"radialaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside"}},"ternary":{"bgcolor":"rgb(237,237,237)","aaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside"},"baxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside"},"caxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside"}},"coloraxis":{"colorbar":{"outlinewidth":0,"tickcolor":"rgb(237,237,237)","ticklen":6,"ticks":"inside"}},"colorscale":{"sequential":[[0,"rgb(20,44,66)"],[1,"rgb(90,179,244)"]],"sequentialminus":[[0,"rgb(20,44,66)"],[1,"rgb(90,179,244)"]]},"xaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside","title":{"standoff":15},"zerolinecolor":"white","automargin":true},"yaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside","title":{"standoff":15},"zerolinecolor":"white","automargin":true},"scene":{"xaxis":{"backgroundcolor":"rgb(237,237,237)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside","zerolinecolor":"white","gridwidth":2},"yaxis":{"backgroundcolor":"rgb(237,237,237)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside","zerolinecolor":"white","gridwidth":2},"zaxis":{"backgroundcolor":"rgb(237,237,237)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"tickcolor":"rgb(51,51,51)","ticks":"outside","zerolinecolor":"white","gridwidth":2}},"shapedefaults":{"fillcolor":"black","line":{"width":0},"opacity":0.3},"annotationdefaults":{"arrowhead":0,"arrowwidth":1},"geo":{"bgcolor":"white","landcolor":"rgb(237,237,237)","subunitcolor":"white","showland":true,"showlakes":true,"lakecolor":"white"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/gridon.json b/projects/plotly/src/lib/themes/gridon.json
new file mode 100644
index 0000000..12fcc88
--- /dev/null
+++ b/projects/plotly/src/lib/themes/gridon.json
@@ -0,0 +1 @@
+{"xaxis":{"showgrid":true,"title":{"standoff":15}},"yaxis":{"showgrid":true,"title":{"standoff":15}}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/plotly.json b/projects/plotly/src/lib/themes/plotly.json
new file mode 100644
index 0000000..8bba2d2
--- /dev/null
+++ b/projects/plotly/src/lib/themes/plotly.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["#636efa","#EF553B","#00cc96","#ab63fa","#FFA15A","#19d3f3","#FF6692","#B6E880","#FF97FF","#FECB52"],"font":{"color":"#2a3f5f"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"white","plot_bgcolor":"#E5ECF6","polar":{"bgcolor":"#E5ECF6","angularaxis":{"gridcolor":"white","linecolor":"white","ticks":""},"radialaxis":{"gridcolor":"white","linecolor":"white","ticks":""}},"ternary":{"bgcolor":"#E5ECF6","aaxis":{"gridcolor":"white","linecolor":"white","ticks":""},"baxis":{"gridcolor":"white","linecolor":"white","ticks":""},"caxis":{"gridcolor":"white","linecolor":"white","ticks":""}},"coloraxis":{"colorbar":{"outlinewidth":0,"ticks":""}},"colorscale":{"sequential":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"sequentialminus":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"diverging":[[0,"#8e0152"],[0.1,"#c51b7d"],[0.2,"#de77ae"],[0.3,"#f1b6da"],[0.4,"#fde0ef"],[0.5,"#f7f7f7"],[0.6,"#e6f5d0"],[0.7,"#b8e186"],[0.8,"#7fbc41"],[0.9,"#4d9221"],[1,"#276419"]]},"xaxis":{"gridcolor":"white","linecolor":"white","ticks":"","title":{"standoff":15},"zerolinecolor":"white","automargin":true,"zerolinewidth":2},"yaxis":{"gridcolor":"white","linecolor":"white","ticks":"","title":{"standoff":15},"zerolinecolor":"white","automargin":true,"zerolinewidth":2},"scene":{"xaxis":{"backgroundcolor":"#E5ECF6","gridcolor":"white","linecolor":"white","showbackground":true,"ticks":"","zerolinecolor":"white","gridwidth":2},"yaxis":{"backgroundcolor":"#E5ECF6","gridcolor":"white","linecolor":"white","showbackground":true,"ticks":"","zerolinecolor":"white","gridwidth":2},"zaxis":{"backgroundcolor":"#E5ECF6","gridcolor":"white","linecolor":"white","showbackground":true,"ticks":"","zerolinecolor":"white","gridwidth":2}},"shapedefaults":{"line":{"color":"#2a3f5f"}},"annotationdefaults":{"arrowcolor":"#2a3f5f","arrowhead":0,"arrowwidth":1},"geo":{"bgcolor":"white","landcolor":"#E5ECF6","subunitcolor":"white","showland":true,"showlakes":true,"lakecolor":"white"},"title":{"x":0.05},"mapbox":{"style":"light"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/plotly_dark.json b/projects/plotly/src/lib/themes/plotly_dark.json
new file mode 100644
index 0000000..bc219ab
--- /dev/null
+++ b/projects/plotly/src/lib/themes/plotly_dark.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["#636efa","#EF553B","#00cc96","#ab63fa","#FFA15A","#19d3f3","#FF6692","#B6E880","#FF97FF","#FECB52"],"font":{"color":"#f2f5fa"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"rgb(17,17,17)","plot_bgcolor":"rgb(17,17,17)","polar":{"bgcolor":"rgb(17,17,17)","angularaxis":{"gridcolor":"#506784","linecolor":"#506784","ticks":""},"radialaxis":{"gridcolor":"#506784","linecolor":"#506784","ticks":""}},"ternary":{"bgcolor":"rgb(17,17,17)","aaxis":{"gridcolor":"#506784","linecolor":"#506784","ticks":""},"baxis":{"gridcolor":"#506784","linecolor":"#506784","ticks":""},"caxis":{"gridcolor":"#506784","linecolor":"#506784","ticks":""}},"coloraxis":{"colorbar":{"outlinewidth":0,"ticks":""}},"colorscale":{"sequential":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"sequentialminus":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"diverging":[[0,"#8e0152"],[0.1,"#c51b7d"],[0.2,"#de77ae"],[0.3,"#f1b6da"],[0.4,"#fde0ef"],[0.5,"#f7f7f7"],[0.6,"#e6f5d0"],[0.7,"#b8e186"],[0.8,"#7fbc41"],[0.9,"#4d9221"],[1,"#276419"]]},"xaxis":{"gridcolor":"#283442","linecolor":"#506784","ticks":"","title":{"standoff":15},"zerolinecolor":"#283442","automargin":true,"zerolinewidth":2},"yaxis":{"gridcolor":"#283442","linecolor":"#506784","ticks":"","title":{"standoff":15},"zerolinecolor":"#283442","automargin":true,"zerolinewidth":2},"scene":{"xaxis":{"backgroundcolor":"rgb(17,17,17)","gridcolor":"#506784","linecolor":"#506784","showbackground":true,"ticks":"","zerolinecolor":"#C8D4E3","gridwidth":2},"yaxis":{"backgroundcolor":"rgb(17,17,17)","gridcolor":"#506784","linecolor":"#506784","showbackground":true,"ticks":"","zerolinecolor":"#C8D4E3","gridwidth":2},"zaxis":{"backgroundcolor":"rgb(17,17,17)","gridcolor":"#506784","linecolor":"#506784","showbackground":true,"ticks":"","zerolinecolor":"#C8D4E3","gridwidth":2}},"shapedefaults":{"line":{"color":"#f2f5fa"}},"annotationdefaults":{"arrowcolor":"#f2f5fa","arrowhead":0,"arrowwidth":1},"geo":{"bgcolor":"rgb(17,17,17)","landcolor":"rgb(17,17,17)","subunitcolor":"#506784","showland":true,"showlakes":true,"lakecolor":"rgb(17,17,17)"},"title":{"x":0.05},"updatemenudefaults":{"bgcolor":"#506784","borderwidth":0},"sliderdefaults":{"bgcolor":"#C8D4E3","borderwidth":1,"bordercolor":"rgb(17,17,17)","tickwidth":0},"mapbox":{"style":"dark"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/plotly_white.json b/projects/plotly/src/lib/themes/plotly_white.json
new file mode 100644
index 0000000..b6878dd
--- /dev/null
+++ b/projects/plotly/src/lib/themes/plotly_white.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["#636efa","#EF553B","#00cc96","#ab63fa","#FFA15A","#19d3f3","#FF6692","#B6E880","#FF97FF","#FECB52"],"font":{"color":"#2a3f5f"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"white","plot_bgcolor":"white","polar":{"bgcolor":"white","angularaxis":{"gridcolor":"#EBF0F8","linecolor":"#EBF0F8","ticks":""},"radialaxis":{"gridcolor":"#EBF0F8","linecolor":"#EBF0F8","ticks":""}},"ternary":{"bgcolor":"white","aaxis":{"gridcolor":"#DFE8F3","linecolor":"#A2B1C6","ticks":""},"baxis":{"gridcolor":"#DFE8F3","linecolor":"#A2B1C6","ticks":""},"caxis":{"gridcolor":"#DFE8F3","linecolor":"#A2B1C6","ticks":""}},"coloraxis":{"colorbar":{"outlinewidth":0,"ticks":""}},"colorscale":{"sequential":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"sequentialminus":[[0,"#0d0887"],[0.1111111111111111,"#46039f"],[0.2222222222222222,"#7201a8"],[0.3333333333333333,"#9c179e"],[0.4444444444444444,"#bd3786"],[0.5555555555555556,"#d8576b"],[0.6666666666666666,"#ed7953"],[0.7777777777777778,"#fb9f3a"],[0.8888888888888888,"#fdca26"],[1,"#f0f921"]],"diverging":[[0,"#8e0152"],[0.1,"#c51b7d"],[0.2,"#de77ae"],[0.3,"#f1b6da"],[0.4,"#fde0ef"],[0.5,"#f7f7f7"],[0.6,"#e6f5d0"],[0.7,"#b8e186"],[0.8,"#7fbc41"],[0.9,"#4d9221"],[1,"#276419"]]},"xaxis":{"gridcolor":"#EBF0F8","linecolor":"#EBF0F8","ticks":"","title":{"standoff":15},"zerolinecolor":"#EBF0F8","automargin":true,"zerolinewidth":2},"yaxis":{"gridcolor":"#EBF0F8","linecolor":"#EBF0F8","ticks":"","title":{"standoff":15},"zerolinecolor":"#EBF0F8","automargin":true,"zerolinewidth":2},"scene":{"xaxis":{"backgroundcolor":"white","gridcolor":"#DFE8F3","linecolor":"#EBF0F8","showbackground":true,"ticks":"","zerolinecolor":"#EBF0F8","gridwidth":2},"yaxis":{"backgroundcolor":"white","gridcolor":"#DFE8F3","linecolor":"#EBF0F8","showbackground":true,"ticks":"","zerolinecolor":"#EBF0F8","gridwidth":2},"zaxis":{"backgroundcolor":"white","gridcolor":"#DFE8F3","linecolor":"#EBF0F8","showbackground":true,"ticks":"","zerolinecolor":"#EBF0F8","gridwidth":2}},"shapedefaults":{"line":{"color":"#2a3f5f"}},"annotationdefaults":{"arrowcolor":"#2a3f5f","arrowhead":0,"arrowwidth":1},"geo":{"bgcolor":"white","landcolor":"white","subunitcolor":"#C8D4E3","showland":true,"showlakes":true,"lakecolor":"white"},"title":{"x":0.05},"mapbox":{"style":"light"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/presentation.json b/projects/plotly/src/lib/themes/presentation.json
new file mode 100644
index 0000000..ebe17e5
--- /dev/null
+++ b/projects/plotly/src/lib/themes/presentation.json
@@ -0,0 +1 @@
+{"xaxis":{"title":{"standoff":15}},"yaxis":{"title":{"standoff":15}},"font":{"size":18}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/seaborn.json b/projects/plotly/src/lib/themes/seaborn.json
new file mode 100644
index 0000000..10c89f0
--- /dev/null
+++ b/projects/plotly/src/lib/themes/seaborn.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["rgb(76,114,176)","rgb(221,132,82)","rgb(85,168,104)","rgb(196,78,82)","rgb(129,114,179)","rgb(147,120,96)","rgb(218,139,195)","rgb(140,140,140)","rgb(204,185,116)","rgb(100,181,205)"],"font":{"color":"rgb(36,36,36)"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"white","plot_bgcolor":"rgb(234,234,242)","polar":{"bgcolor":"rgb(234,234,242)","angularaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":""},"radialaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":""}},"ternary":{"bgcolor":"rgb(234,234,242)","aaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":""},"baxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":""},"caxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":""}},"coloraxis":{"colorbar":{"outlinewidth":0,"tickcolor":"rgb(36,36,36)","ticklen":8,"ticks":"outside","tickwidth":2}},"colorscale":{"sequential":[[0,"rgb(2,4,25)"],[0.06274509803921569,"rgb(24,15,41)"],[0.12549019607843137,"rgb(47,23,57)"],[0.18823529411764706,"rgb(71,28,72)"],[0.25098039215686274,"rgb(97,30,82)"],[0.3137254901960784,"rgb(123,30,89)"],[0.3764705882352941,"rgb(150,27,91)"],[0.4392156862745098,"rgb(177,22,88)"],[0.5019607843137255,"rgb(203,26,79)"],[0.5647058823529412,"rgb(223,47,67)"],[0.6274509803921569,"rgb(236,76,61)"],[0.6901960784313725,"rgb(242,107,73)"],[0.7529411764705882,"rgb(244,135,95)"],[0.8156862745098039,"rgb(245,162,122)"],[0.8784313725490196,"rgb(246,188,153)"],[0.9411764705882353,"rgb(247,212,187)"],[1,"rgb(250,234,220)"]],"sequentialminus":[[0,"rgb(2,4,25)"],[0.06274509803921569,"rgb(24,15,41)"],[0.12549019607843137,"rgb(47,23,57)"],[0.18823529411764706,"rgb(71,28,72)"],[0.25098039215686274,"rgb(97,30,82)"],[0.3137254901960784,"rgb(123,30,89)"],[0.3764705882352941,"rgb(150,27,91)"],[0.4392156862745098,"rgb(177,22,88)"],[0.5019607843137255,"rgb(203,26,79)"],[0.5647058823529412,"rgb(223,47,67)"],[0.6274509803921569,"rgb(236,76,61)"],[0.6901960784313725,"rgb(242,107,73)"],[0.7529411764705882,"rgb(244,135,95)"],[0.8156862745098039,"rgb(245,162,122)"],[0.8784313725490196,"rgb(246,188,153)"],[0.9411764705882353,"rgb(247,212,187)"],[1,"rgb(250,234,220)"]]},"xaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":"","title":{"standoff":15},"zerolinecolor":"white","automargin":true},"yaxis":{"gridcolor":"white","linecolor":"white","showgrid":true,"ticks":"","title":{"standoff":15},"zerolinecolor":"white","automargin":true},"scene":{"xaxis":{"backgroundcolor":"rgb(234,234,242)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"ticks":"","zerolinecolor":"white","gridwidth":2},"yaxis":{"backgroundcolor":"rgb(234,234,242)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"ticks":"","zerolinecolor":"white","gridwidth":2},"zaxis":{"backgroundcolor":"rgb(234,234,242)","gridcolor":"white","linecolor":"white","showbackground":true,"showgrid":true,"ticks":"","zerolinecolor":"white","gridwidth":2}},"shapedefaults":{"fillcolor":"rgb(67,103,167)","line":{"width":0},"opacity":0.5},"annotationdefaults":{"arrowcolor":"rgb(67,103,167)"},"geo":{"bgcolor":"white","landcolor":"rgb(234,234,242)","subunitcolor":"white","showland":true,"showlakes":true,"lakecolor":"white"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/simple_white.json b/projects/plotly/src/lib/themes/simple_white.json
new file mode 100644
index 0000000..f4d5e1a
--- /dev/null
+++ b/projects/plotly/src/lib/themes/simple_white.json
@@ -0,0 +1 @@
+{"autotypenumbers":"strict","colorway":["#1F77B4","#FF7F0E","#2CA02C","#D62728","#9467BD","#8C564B","#E377C2","#7F7F7F","#BCBD22","#17BECF"],"font":{"color":"rgb(36,36,36)"},"hovermode":"closest","hoverlabel":{"align":"left"},"paper_bgcolor":"white","plot_bgcolor":"white","polar":{"bgcolor":"white","angularaxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside"},"radialaxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside"}},"ternary":{"bgcolor":"white","aaxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside"},"baxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside"},"caxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside"}},"coloraxis":{"colorbar":{"outlinewidth":1,"tickcolor":"rgb(36,36,36)","ticks":"outside"}},"colorscale":{"sequential":[[0,"#440154"],[0.1111111111111111,"#482878"],[0.2222222222222222,"#3e4989"],[0.3333333333333333,"#31688e"],[0.4444444444444444,"#26828e"],[0.5555555555555556,"#1f9e89"],[0.6666666666666666,"#35b779"],[0.7777777777777778,"#6ece58"],[0.8888888888888888,"#b5de2b"],[1,"#fde725"]],"sequentialminus":[[0,"#440154"],[0.1111111111111111,"#482878"],[0.2222222222222222,"#3e4989"],[0.3333333333333333,"#31688e"],[0.4444444444444444,"#26828e"],[0.5555555555555556,"#1f9e89"],[0.6666666666666666,"#35b779"],[0.7777777777777778,"#6ece58"],[0.8888888888888888,"#b5de2b"],[1,"#fde725"]],"diverging":[[0,"rgb(103,0,31)"],[0.1,"rgb(178,24,43)"],[0.2,"rgb(214,96,77)"],[0.3,"rgb(244,165,130)"],[0.4,"rgb(253,219,199)"],[0.5,"rgb(247,247,247)"],[0.6,"rgb(209,229,240)"],[0.7,"rgb(146,197,222)"],[0.8,"rgb(67,147,195)"],[0.9,"rgb(33,102,172)"],[1,"rgb(5,48,97)"]]},"xaxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside","title":{"standoff":15},"zerolinecolor":"rgb(36,36,36)","automargin":true,"zeroline":false},"yaxis":{"gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showgrid":false,"showline":true,"ticks":"outside","title":{"standoff":15},"zerolinecolor":"rgb(36,36,36)","automargin":true,"zeroline":false},"scene":{"xaxis":{"backgroundcolor":"white","gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showbackground":true,"showgrid":false,"showline":true,"ticks":"outside","zerolinecolor":"rgb(36,36,36)","gridwidth":2,"zeroline":false},"yaxis":{"backgroundcolor":"white","gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showbackground":true,"showgrid":false,"showline":true,"ticks":"outside","zerolinecolor":"rgb(36,36,36)","gridwidth":2,"zeroline":false},"zaxis":{"backgroundcolor":"white","gridcolor":"rgb(232,232,232)","linecolor":"rgb(36,36,36)","showbackground":true,"showgrid":false,"showline":true,"ticks":"outside","zerolinecolor":"rgb(36,36,36)","gridwidth":2,"zeroline":false}},"shapedefaults":{"fillcolor":"black","line":{"width":0},"opacity":0.3},"annotationdefaults":{"arrowhead":0,"arrowwidth":1},"geo":{"bgcolor":"white","landcolor":"white","subunitcolor":"white","showland":true,"showlakes":true,"lakecolor":"white"},"title":{"x":0.05},"mapbox":{"style":"light"}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/xgridoff.json b/projects/plotly/src/lib/themes/xgridoff.json
new file mode 100644
index 0000000..eebb34b
--- /dev/null
+++ b/projects/plotly/src/lib/themes/xgridoff.json
@@ -0,0 +1 @@
+{"xaxis":{"showgrid":false,"title":{"standoff":15}},"yaxis":{"title":{"standoff":15}}}
\ No newline at end of file
diff --git a/projects/plotly/src/lib/themes/ygridoff.json b/projects/plotly/src/lib/themes/ygridoff.json
new file mode 100644
index 0000000..f8254bb
--- /dev/null
+++ b/projects/plotly/src/lib/themes/ygridoff.json
@@ -0,0 +1 @@
+{"yaxis":{"showgrid":false}}
\ No newline at end of file