Arctic Angular
Dasboard Template

Theming Guide

Set your default theme by assigning a new theme to activatedTheme in the constructor function of ThemeService (Location: src/app/shared/services/theme.service.ts).

Four custom themes are included.

• egret-navy
• egret-indigo
• egret-dark-pink
• egret-dark-purple

These files are located in src/assets/styles/scss/themes

At the top bar there is a theme switcher. If you don’t want to use theme switcher, remove that from topbar.

Open _theme.scss (Location: src/assets/styles/scss/_themes.scss) keep only one theme file, if you don't need multiple themes.

Creating a new theme

First create color palettes for

• primary
• accent and
• warn

Create palette here http://mcg.mbitson.com. Copy sass code for angular 2+, create file like src/assets/styles/scss/themes/_egret-navy.scss with the generated code.And include that file in src/assets/styles/scss/_themes.scss

For more about Angular material theming

• Angular material theming doc.