diff --git a/aio/package.json b/aio/package.json
index f6cb6659c0..71ca5d4083 100644
--- a/aio/package.json
+++ b/aio/package.json
@@ -78,12 +78,12 @@
   "private": true,
   "dependencies": {
     "@angular/animations": "^8.0.0-beta.14",
-    "@angular/cdk": "7.0.0",
+    "@angular/cdk": "8.0.0-beta.2",
     "@angular/common": "^8.0.0-beta.14",
     "@angular/core": "^8.0.0-beta.14",
     "@angular/elements": "^8.0.0-beta.14",
     "@angular/forms": "^8.0.0-beta.14",
-    "@angular/material": "7.0.0",
+    "@angular/material": "8.0.0-beta.2",
     "@angular/platform-browser": "^8.0.0-beta.14",
     "@angular/platform-browser-dynamic": "^8.0.0-beta.14",
     "@angular/router": "^8.0.0-beta.14",
diff --git a/aio/scripts/_payload-limits.json b/aio/scripts/_payload-limits.json
index 6c4da07d5d..45d3b7668c 100755
--- a/aio/scripts/_payload-limits.json
+++ b/aio/scripts/_payload-limits.json
@@ -3,7 +3,7 @@
     "master": {
       "uncompressed": {
         "runtime": 2972,
-        "main": 497135,
+        "main": 501350,
         "polyfills": 59197
       }
     }
diff --git a/aio/src/app/app.component.spec.ts b/aio/src/app/app.component.spec.ts
index 3c8f6b76a6..def9049713 100644
--- a/aio/src/app/app.component.spec.ts
+++ b/aio/src/app/app.component.spec.ts
@@ -3,7 +3,8 @@ import { inject, ComponentFixture, TestBed, fakeAsync, tick } from '@angular/cor
 import { Title } from '@angular/platform-browser';
 import { APP_BASE_HREF } from '@angular/common';
 import { HttpClient } from '@angular/common/http';
-import { MatProgressBar, MatSidenav } from '@angular/material';
+import { MatProgressBar } from '@angular/material/progress-bar';
+import { MatSidenav } from '@angular/material/sidenav';
 import { By } from '@angular/platform-browser';
 
 import { of, timer } from 'rxjs';
diff --git a/aio/src/app/custom-elements/code/code-tabs.module.ts b/aio/src/app/custom-elements/code/code-tabs.module.ts
index eac0e29b37..e2e77d0bce 100644
--- a/aio/src/app/custom-elements/code/code-tabs.module.ts
+++ b/aio/src/app/custom-elements/code/code-tabs.module.ts
@@ -1,7 +1,8 @@
 import { NgModule, Type } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CodeTabsComponent } from './code-tabs.component';
-import { MatCardModule, MatTabsModule } from '@angular/material';
+import { MatCardModule } from '@angular/material/card';
+import { MatTabsModule } from '@angular/material/tabs';
 import { CodeModule } from './code.module';
 import { WithCustomElementComponent } from '../element-registry';
 
diff --git a/aio/src/app/custom-elements/code/code.component.spec.ts b/aio/src/app/custom-elements/code/code.component.spec.ts
index a25872cbf5..a814754ab7 100644
--- a/aio/src/app/custom-elements/code/code.component.spec.ts
+++ b/aio/src/app/custom-elements/code/code.component.spec.ts
@@ -1,6 +1,6 @@
 import { Component, ViewChild, AfterViewInit } from '@angular/core';
 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatSnackBar } from '@angular/material';
+import { MatSnackBar } from '@angular/material/snack-bar';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { first } from 'rxjs/operators';
diff --git a/aio/src/app/custom-elements/code/code.module.ts b/aio/src/app/custom-elements/code/code.module.ts
index ced134dcb4..9bc657df07 100644
--- a/aio/src/app/custom-elements/code/code.module.ts
+++ b/aio/src/app/custom-elements/code/code.module.ts
@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { CodeComponent } from './code.component';
-import { MatSnackBarModule } from '@angular/material';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { PrettyPrinter } from './pretty-printer.service';
 import { CopierService } from 'app/shared/copier.service';
 
diff --git a/aio/src/app/shared/custom-icon-registry.spec.ts b/aio/src/app/shared/custom-icon-registry.spec.ts
index 77e6233bb9..be35c3d136 100644
--- a/aio/src/app/shared/custom-icon-registry.spec.ts
+++ b/aio/src/app/shared/custom-icon-registry.spec.ts
@@ -1,4 +1,4 @@
-import { MatIconRegistry } from '@angular/material';
+import { MatIconRegistry } from '@angular/material/icon';
 import { CustomIconRegistry, SvgIconInfo } from './custom-icon-registry';
 
 describe('CustomIconRegistry', () => {
diff --git a/aio/yarn.lock b/aio/yarn.lock
index 264de3d6e2..258d0568e7 100644
--- a/aio/yarn.lock
+++ b/aio/yarn.lock
@@ -111,9 +111,10 @@
   dependencies:
     tslib "^1.9.0"
 
-"@angular/cdk@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-7.0.0.tgz#b98d7378e84fed1af30c460aa91af4ada2cf252b"
+"@angular/cdk@8.0.0-beta.2":
+  version "8.0.0-beta.2"
+  resolved "https://registry.yarnpkg.com/@angular/cdk/-/cdk-8.0.0-beta.2.tgz#27544be4a99b0d56bdbf9f206b2f8e290de82f61"
+  integrity sha512-/ze014/AGp9nAI6kK7w6TQnz533PRvjJOpEULaBclNRHSNGZElncOGPfnD6V/Zr/CKY5zFbwLHQEqVUP4ObTwg==
   dependencies:
     tslib "^1.7.1"
   optionalDependencies:
@@ -198,9 +199,10 @@
   resolved "https://registry.yarnpkg.com/@angular/language-service/-/language-service-8.0.0-beta.14.tgz#cf293951d518889cdaedc433306d0699d078a364"
   integrity sha512-FNPYEDEUlgF7dejL6spCtLs/7+nMq7mAAMvtI1hPDldAhLMkfygrGlxtDrREG+6ekYDBJVpHy7Sik/e9Hn/Szw==
 
-"@angular/material@7.0.0":
-  version "7.0.0"
-  resolved "https://registry.yarnpkg.com/@angular/material/-/material-7.0.0.tgz#00cacc2f210c5d7e822e34b09078f41df52d8f58"
+"@angular/material@8.0.0-beta.2":
+  version "8.0.0-beta.2"
+  resolved "https://registry.yarnpkg.com/@angular/material/-/material-8.0.0-beta.2.tgz#91abce0ef64b655ecec4ff3895ab02c485906071"
+  integrity sha512-3816IV/IVg1juj6jlEbXmWepl97JsLwVO0aHRGpTg8FAdilK5w36eUiXCqKecvDnNAHpwDFavAwrAlToxUQBvw==
   dependencies:
     tslib "^1.7.1"