Angular 2 Material Cheat Sheet (DRAFT) by walkernel

palette.scss

/src

@import '~@angular/material/src/lib/core/theming/all-theme';

@include md-core();

$YourApp-app-primary: md-palette(PimaryColor);

$YourApp-app-accent: md-palette(AccentColor);

$YourApp-app-warn: md-palette(WarnColor);

$YourApp-app-theme: md-light-theme($YourApp-app-primary, $YourApp-app-accent, $YourApp-app-warn);

{

...,

"apps": [

...,

"styles": [

...,

palette.scss,

...

].

],

...

}

npm install --save @angul­ar/­mat­erial

import { Materi­alM­odule } from '@angu­lar­/ma­ter­ial';

@NgMod­ule({

imports: [Mater­ial­Mod­ule.fo­rRo­ot()],

 ...

})

@import '~@ang­ula­r/m­ate­ria­l/s­rc/­lib­/co­re/­the­min­g/t­hem­ing';

@import 'src/p­ale­tte.scss';

// Use md-color to extract individual colors from a palette as necessary.

.YourClass {

backgr­oun­d-c­olor: md-color($YourApp-app-p­rim­ary);

border­-color: md-color($YourApp-app-a­ccent);

}