diff --git a/GOVERNANCE.md b/GOVERNANCE.md
index ce7dc48e618cda..f6b31ff4ab62c8 100644
--- a/GOVERNANCE.md
+++ b/GOVERNANCE.md
@@ -5,7 +5,7 @@
 ## Overview
 
 Mui-Org houses projects related to [Material-UI](https://material-ui.com/), a set of [React](https://reactjs.org/) components
-that implement [Google's Material Design](https://material.io/guidelines/material-design/introduction.html)
+that implement [Google's Material Design](https://material.io/design/introduction)
 specification. Our mission is to create a customizable Material Design implementation
 for anyone to use. We value an open, collaborative, and diverse community where anyone can join in
 discussions, learn from one another, and contribute to the project. This document describes how
diff --git a/docs/src/modules/components/Head.js b/docs/src/modules/components/Head.js
index 87b0a362b2445a..7ede23a2858a80 100644
--- a/docs/src/modules/components/Head.js
+++ b/docs/src/modules/components/Head.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import NextHead from 'next/head';
-import { withRouter } from 'next/router';
+import { _rewriteUrlForNextExport, withRouter } from 'next/router';
 import PropTypes from 'prop-types';
 
 function Head(props) {
@@ -19,7 +19,10 @@ function Head(props) {
       {/* Facebook */}
       <meta property="og:type" content="website" />
       <meta property="og:title" content={title} />
-      <meta property="og:url" content={`https://material-ui.com${router.asPath}`} />
+      <meta
+        property="og:url"
+        content={`https://material-ui.com${_rewriteUrlForNextExport(router.asPath)}`}
+      />
       <meta property="og:description" content={description} />
       <meta property="og:image" content="https://material-ui.com/static/brand.png" />
       <meta property="og:locale" content="en_US" />
diff --git a/docs/src/modules/components/Tidelift.js b/docs/src/modules/components/Tidelift.js
index 64b0f25e3509d3..ca3bc6ae2cc2e0 100644
--- a/docs/src/modules/components/Tidelift.js
+++ b/docs/src/modules/components/Tidelift.js
@@ -41,7 +41,7 @@ function Tidelift(props) {
     <Link
       className={classes.root}
       variant="button"
-      href="https://tidelift.com/subscription/npm/material-ui?utm_source=material_ui&utm_medium=referral&utm_campaign=homepage"
+      href="https://tidelift.com/subscription/pkg/npm-material-ui?utm_source=material_ui&utm_medium=referral&utm_campaign=homepage"
       target="_blank"
       rel="noopener"
     >
diff --git a/docs/src/modules/utils/generateMarkdown.js b/docs/src/modules/utils/generateMarkdown.js
index 8bfd738edeaf92..aab83910fff7ce 100644
--- a/docs/src/modules/utils/generateMarkdown.js
+++ b/docs/src/modules/utils/generateMarkdown.js
@@ -271,7 +271,7 @@ This property accepts the following keys:
 
 ${text}
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](${SOURCE_CODE_ROOT_URL}${normalizePath(
     reactAPI.filename,
   )})
@@ -308,9 +308,9 @@ function generateInheritance(reactAPI) {
 
   return `## Inheritance
 
-The properties of the [${inheritance.component}](${
-    inheritance.pathname
-  }) component${suffix} are also available.
+The properties of the [${inheritance.component}](${_rewriteUrlForNextExport(
+    inheritance.pathname,
+  )}) component${suffix} are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 `;
diff --git a/docs/src/pages/customization/css-in-js/css-in-js.md b/docs/src/pages/customization/css-in-js/css-in-js.md
index a079db741f1dc1..354076915823dd 100644
--- a/docs/src/pages/customization/css-in-js/css-in-js.md
+++ b/docs/src/pages/customization/css-in-js/css-in-js.md
@@ -4,7 +4,7 @@
 
 Material-UI aims to provide strong foundations for building dynamic UIs.
 For the sake of simplicity, **we expose our styling solution to users**.
-You can use it, but you don't have to. This styling solution is [interoperable with](/guides/interoperability) all the other major solutions.
+You can use it, but you don't have to. This styling solution is [interoperable with](/guides/interoperability/) all the other major solutions.
 
 ## Material-UI's styling solution
 
@@ -39,7 +39,7 @@ Check the jss-rtl [readme](https://github.com/alitaheri/jss-rtl#simple-usage) to
 
 When rendering on the server, you will need to get all rendered styles as a CSS string.
 The `SheetsRegistry` class allows you to manually aggregate and stringify them.
-Read more about [Server Rendering](/guides/server-rendering).
+Read more about [Server Rendering](/guides/server-rendering/).
 
 {{"demo": "pages/customization/css-in-js/JssRegistry.js", "hideEditButton": true}}
 
@@ -206,8 +206,8 @@ export default App;
 react-jss exposes a `JssProvider` component to configure JSS for the underlying child components.
 There are different use cases:
 - Providing a class name generator.
-- [Providing a Sheets registry.](/customization/css-in-js#sheets-registry)
-- Providing a JSS instance. You might want to support [Right-to-left](/guides/right-to-left) or changing the [CSS injection order](/customization/css-in-js#css-injection-order).
+- [Providing a Sheets registry.](/customization/css-in-js/#sheets-registry)
+- Providing a JSS instance. You might want to support [Right-to-left](/guides/right-to-left/) or changing the [CSS injection order](/customization/css-in-js/#css-injection-order).
 Read [the JSS documentation](http://cssinjs.org/js-api/) to learn more about the options available.
 Here is an example:
 
@@ -295,7 +295,7 @@ class MyComponent extends React.Component {
 export default withStyles(styles)(MyComponent);
 ```
 
-Also, you can use as [decorators](https://babeljs.io/docs/plugins/transform-decorators/) like so:
+Also, you can use as [decorators](https://babeljs.io/docs/en/babel-plugin-transform-decorators/) like so:
 
 ```jsx
 import { withStyles } from '@material-ui/core/styles';
@@ -318,7 +318,7 @@ export default MyComponent
 
 ### `createGenerateClassName([options]) => class name generator`
 
-A function which returns [a class name generator function](http://cssinjs.org/js-api#generate-your-own-class-names).
+A function which returns [a class name generator function](http://cssinjs.org/js-api/#generate-your-own-class-names).
 
 #### Arguments
 
diff --git a/docs/src/pages/customization/overrides/overrides.md b/docs/src/pages/customization/overrides/overrides.md
index a1c34bff0664ee..52b74f391c9cbb 100644
--- a/docs/src/pages/customization/overrides/overrides.md
+++ b/docs/src/pages/customization/overrides/overrides.md
@@ -17,10 +17,10 @@ You might need to change the style of a component in some very specific situatio
 The first way to override the style of a component is to use **class names**.
 Every component provides a `className` property which is always applied to the root element.
 
-In this example, we are using the [`withStyles()`](/customization/css-in-js#withstyles-styles-options-higher-order-component) higher-order
+In this example, we are using the [`withStyles()`](/customization/css-in-js/#withstyles-styles-options-higher-order-component) higher-order
 component to inject custom styles into the DOM, and to pass the class name to the `ClassNames` component via
 its `classes` prop. You can choose any other styling solution, or even plain CSS to create the styles, but be sure to
-consider the [CSS injection order](/customization/css-in-js#css-injection-order), as the CSS injected into the DOM
+consider the [CSS injection order](/customization/css-in-js/#css-injection-order), as the CSS injected into the DOM
 by Material-UI to style a component has the highest specificity possible since the `<link>` is injected at the bottom
 of the `<head />` to ensure the components always render correctly.
 
@@ -131,7 +131,7 @@ You don't have to worry about CSS specificity as the inline-style takes preceden
 
 {{"demo": "pages/customization/overrides/InlineStyle.js"}}
 
-[When should I use inline-style vs classes?](/getting-started/faq#when-should-i-use-inline-style-vs-classes-)
+[When should I use inline-style vs classes?](/getting-started/faq/#when-should-i-use-inline-style-vs-classes-)
 
 ## 2. Dynamic variation for a one-time situation
 
@@ -180,7 +180,7 @@ The best approach is to follow option 1 and then take advantage of the compositi
 
 The Material Design specification documents different variations of certain components, such as how buttons come in different shapes: [text](https://material.io/design/components/buttons.html#text-button) (AKA "flat"), [contained](https://material.io/design/components/buttons.html#contained-button) (AKA "raised"), [FAB](https://material.io/design/components/buttons-floating-action-button.html) and more.
 
-Material-UI attempts to implement all of these variations. Please refer to the [Supported Components](/getting-started/supported-components) documentation to find out the current status of all supported Material Design components.
+Material-UI attempts to implement all of these variations. Please refer to the [Supported Components](/getting-started/supported-components/) documentation to find out the current status of all supported Material Design components.
 
 ## 5. Global theme variation
 
@@ -200,4 +200,4 @@ Learn more about it in the [themes section](/customization/themes#customizing-al
 
 You can also customize all instances of a component with CSS.
 We expose a `dangerouslyUseGlobalCSS` option to do so.
-Learn more about it in the [CSS in JS section](/customization/css-in-js#global-css) of the documentation. It's very similar to how you would customize Bootstrap.
+Learn more about it in the [CSS in JS section](/customization/css-in-js/#global-css) of the documentation. It's very similar to how you would customize Bootstrap.
diff --git a/docs/src/pages/customization/themes/themes.md b/docs/src/pages/customization/themes/themes.md
index eb0a0186391b18..b92fd565178276 100644
--- a/docs/src/pages/customization/themes/themes.md
+++ b/docs/src/pages/customization/themes/themes.md
@@ -49,9 +49,9 @@ If you want to learn more about color, you can check out [the color section](/st
 
 You may override the default palette values by including a `palette` object as part of your theme.
 
-If any of the [`palette.primary`](/customization/default-theme?expend-path=$.palette.primary),
-[`palette.secondary`](/customization/default-theme?expend-path=$.palette.secondary) or
-[`palette.error`](/customization/default-theme?expend-path=$.palette.error)
+If any of the [`palette.primary`](/customization/default-theme/?expend-path=$.palette.primary),
+[`palette.secondary`](/customization/default-theme/?expend-path=$.palette.secondary) or
+[`palette.error`](/customization/default-theme/?expend-path=$.palette.error)
 'intention' objects are provided, they will replace the defaults.
 
 The intention value can either be a [color](/style/color) object, or an object with one or more of the following keys:
@@ -210,7 +210,7 @@ The theme provides a **limited set of type sizes** that work well together along
 These sizes are used across the components.
 
 Have a look at the following example regarding changing the default values, such as the font family.
-If you want to learn more about typography, you can check out [the typography section](/style/typography).
+If you want to learn more about typography, you can check out [the typography section](/style/typography/).
 
 {{"demo": "pages/customization/themes/TypographyTheme.js"}}
 
@@ -290,11 +290,11 @@ html {
 ### Other variables
 
 In addition to the palette, dark and light types, and typography, the theme normalizes implementation by providing many more default values, such as breakpoints, shadows, transitions, etc.
-You can check out the [default theme section](/customization/default-theme) to view the default theme in full.
+You can check out the [default theme section](/customization/default-theme/) to view the default theme in full.
 
 ### Custom variables
 
-When using Material-UI's [styling solution](/customization/css-in-js) with your own components,
+When using Material-UI's [styling solution](/customization/css-in-js/) with your own components,
 you can also take advantage of the theme.
 It can be convenient to add additional variables to the theme so you can use them everywhere.
 For instance:
diff --git a/docs/src/pages/demos/dialogs/dialogs.md b/docs/src/pages/demos/dialogs/dialogs.md
index daf37541b8707d..6471f57639d5ef 100644
--- a/docs/src/pages/demos/dialogs/dialogs.md
+++ b/docs/src/pages/demos/dialogs/dialogs.md
@@ -67,7 +67,7 @@ For example, if your site prompts for potential subscribers to fill in their ema
 
 ## Responsive full-screen
 
-You may make a `Dialog` responsively full screen the dialog using `withMobileDialog`. By default, `withMobileDialog()(Dialog)` responsively full screens *at or below* the `sm` [screen size](/layout/basics). You can choose your own breakpoint for example `xs` by passing the `breakpoint` argument: `withMobileDialog({breakpoint: 'xs'})(Dialog)`.
+You may make a `Dialog` responsively full screen the dialog using `withMobileDialog`. By default, `withMobileDialog()(Dialog)` responsively full screens *at or below* the `sm` [screen size](/layout/basics/). You can choose your own breakpoint for example `xs` by passing the `breakpoint` argument: `withMobileDialog({breakpoint: 'xs'})(Dialog)`.
 
 {{"demo": "pages/demos/dialogs/ResponsiveDialog.js"}}
 
diff --git a/docs/src/pages/discover-more/team/team.md b/docs/src/pages/discover-more/team/team.md
index 10fe2b0aaf0f32..f111fefc116ba5 100644
--- a/docs/src/pages/discover-more/team/team.md
+++ b/docs/src/pages/discover-more/team/team.md
@@ -10,4 +10,4 @@ The development of the project and its ecosystem is guided by an international t
 Get involved with Material-UI development by [opening an issue](https://github.com/mui-org/material-ui/issues/new) or submitting a pull request.
 Read our [contributing guidelines](https://github.com/mui-org/material-ui/blob/master/CONTRIBUTING.md) for information on how we develop.
 
-[Join the Material-UI Community!](/discover-more/community)
+[Join the Material-UI Community!](/discover-more/community/)
diff --git a/docs/src/pages/getting-started/comparison/comparison.md b/docs/src/pages/getting-started/comparison/comparison.md
index a15ae6b89aaa69..cccbd65e1b10cd 100644
--- a/docs/src/pages/getting-started/comparison/comparison.md
+++ b/docs/src/pages/getting-started/comparison/comparison.md
@@ -78,7 +78,7 @@ We removed one important friction in the installation process. (**simpler**)
 Eventually, we reached the limitations of inline-styles and moved toward a CSS-in-JS
 solution. This transition was made without losing the enhancements the first migration introduced 💅.
 **We strongly think that CSS-in-JS is the future of the web platform**.
-You can [learn more about our new styling solution](/customization/css-in-js) in the documentation.
+You can [learn more about our new styling solution](/customization/css-in-js/) in the documentation.
 
 MDC-web relies on SCSS as Bootstrap v4. The SCSS architecture is pretty close to LESS -
 a technology we replaced for its limitations.
@@ -117,7 +117,7 @@ The **less** time you spend on a single contribution, the **more** contributions
 ### Browser support
 
 Materialize supports a wider range of browsers than Material-UI does, for instance,
-they support IE 10 while [we only support IE 11](/getting-started/supported-platforms).
+they support IE 10 while [we only support IE 11](/getting-started/supported-platforms/).
 Only supporting IE 11 allows us to take full advantage of the flexbox layout.
 IE 10 has many issues with flexbox.
 
diff --git a/docs/src/pages/getting-started/faq/faq.md b/docs/src/pages/getting-started/faq/faq.md
index b2e63b817b26fe..cc2624f786b288 100644
--- a/docs/src/pages/getting-started/faq/faq.md
+++ b/docs/src/pages/getting-started/faq/faq.md
@@ -48,7 +48,7 @@ It's highly recommended:
 
 However perhaps you're adding some Material-UI components to an app that already uses another styling solution,
 or are already familiar with a different API, and don't want to learn a new one? In that case, head over to the
-[Style Library Interoperability](/guides/interoperability) section,
+[Style Library Interoperability](/guides/interoperability/) section,
 where we show how simple it is to restyle Material-UI components with alternative style libraries.
 
 ## When should I use inline-style vs classes?
diff --git a/docs/src/pages/getting-started/installation/installation.md b/docs/src/pages/getting-started/installation/installation.md
index 5dd1c11375e6e3..101d555a93d106 100644
--- a/docs/src/pages/getting-started/installation/installation.md
+++ b/docs/src/pages/getting-started/installation/installation.md
@@ -17,7 +17,7 @@ Please note that [react](https://www.npmjs.com/package/react) >= 16.3.0 and [rea
 ## Roboto Font
 
 Material-UI was designed with the [Roboto](https://fonts.google.com/specimen/Roboto)
-font in mind. So be sure to follow [these instructions](/style/typography#general).
+font in mind. So be sure to follow [these instructions](/style/typography/#general).
 For instance, via Google Web Fonts:
 ```html
 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">
@@ -26,7 +26,7 @@ For instance, via Google Web Fonts:
 ## Font Icons
 
 In order to use the font `Icon` component you must first add the [Material icons](https://material.io/tools/icons/) font.
-Here are [some instructions](/style/icons#font-icons)
+Here are [some instructions](/style/icons/#font-icons)
 on how to do so.
 For instance, via Google Web Fonts:
 ```html
diff --git a/docs/src/pages/getting-started/supported-components/supported-components.md b/docs/src/pages/getting-started/supported-components/supported-components.md
index 53cc96b6f44216..bf786c971fc266 100644
--- a/docs/src/pages/getting-started/supported-components/supported-components.md
+++ b/docs/src/pages/getting-started/supported-components/supported-components.md
@@ -23,7 +23,7 @@ to discuss the approach before submitting a pull request.
 - **[Buttons: Floating Action Button](https://material.io/design/components/buttons-floating-action-button.html) ✓**
   - Transitions:
     - **[Speed dial](https://material.io/design/components/buttons-floating-action-button.html#types-of-transitions) ~
-     **([Lab](/lab/about))
+     **([Lab](/lab/about/))
     - [Menu](https://material.io/design/components/buttons-floating-action-button.html#types-of-transitions)
     - [Morph](https://material.io/design/components/buttons-floating-action-button.html#types-of-transitions)
     - [Full screen](https://material.io/design/components/buttons-floating-action-button.html#types-of-transitions)
@@ -80,7 +80,7 @@ to discuss the approach before submitting a pull request.
   - **[Radio button](https://material.io/design/components/selection-controls.html#radio-buttons) ✓**
   - **[Switch](https://material.io/design/components/selection-controls.html#switches) ✓**
 - **[Sliders](https://material.io/design/components/sliders.html) ~
-     **([Lab](/lab/about))
+     **([Lab](/lab/about/))
   - **[Continuous](https://material.io/design/components/sliders.html#continuous-slider) ✓**
   - **[Discrete](https://material.io/design/components/sliders.html#discrete-slider) ~** (WIP)
 - **[Snackbars](https://material.io/design/components/snackbars.html) ✓** (*Legacy Material v1*)
diff --git a/docs/src/pages/getting-started/usage/usage.md b/docs/src/pages/getting-started/usage/usage.md
index cea7b667da58c2..21068f25797353 100644
--- a/docs/src/pages/getting-started/usage/usage.md
+++ b/docs/src/pages/getting-started/usage/usage.md
@@ -51,7 +51,7 @@ To ensure proper rendering and touch zooming for all devices, add the responsive
 
 ### CssBaseline
 
-Material-UI provides an optional [CssBaseline](/style/css-baseline) component.
+Material-UI provides an optional [CssBaseline](/style/css-baseline/) component.
 It's fixing some inconsistencies across browsers and devices while providing slightly more opinionated resets to common HTML elements.
 
 ## Versioned Documentation
@@ -62,6 +62,6 @@ You can find older versions of the documentation on a [separate page](/versions/
 ## Next steps
 
 Now that you have an idea of the basic setup, it's time to learn more about:
-- How to provide [the Material Design font and typography](/style/typography).
+- How to provide [the Material Design font and typography](/style/typography/).
 - How to take advantage of the [theming solution](/customization/themes).
 - How to [override](/customization/overrides) the look and feel of the components.
diff --git a/docs/src/pages/guides/api/api.md b/docs/src/pages/guides/api/api.md
index 59a59f3dd4be26..9d42962be9742b 100644
--- a/docs/src/pages/guides/api/api.md
+++ b/docs/src/pages/guides/api/api.md
@@ -37,11 +37,11 @@ The `disableRipple` property will flow this way: [`MenuItem`](/api/menu-item/) >
 
 ### Native properties
 
-We avoid documenting native properties supported by the DOM like [`className`](/customization/overrides#overriding-with-class-names).
+We avoid documenting native properties supported by the DOM like [`className`](/customization/overrides/#overriding-with-class-names).
 
 ### CSS Classes
 
-All the components accept a [`classes`](/customization/overrides#overriding-with-classes) property to customize the styles.
+All the components accept a [`classes`](/customization/overrides/#overriding-with-classes) property to customize the styles.
 The classes design answers two constraints:
 to make the classes structure as simple as possible, while sufficient to implement the Material Design specification.
 - The class applied to the root element is always called `root`.
@@ -81,7 +81,7 @@ Nested components inside a component have:
 - their own `xxxComponent` property for performing component injection.
 - their own `xxxRef` property when user might need to perform imperative actions,
   for instance, exposing a `inputRef` property to access the native `input` on the `Input` component.
-  This helps answer the  question ["How can I access the DOM element?"](/getting-started/faq#how-can-i-access-the-dom-element-)
+  This helps answer the  question ["How can I access the DOM element?"](/getting-started/faq/#how-can-i-access-the-dom-element-)
 
 ### Property naming
 
diff --git a/docs/src/pages/guides/migration-v0x/migration-v0x.md b/docs/src/pages/guides/migration-v0x/migration-v0x.md
index 5b97110deddba3..26f2f2721a474e 100644
--- a/docs/src/pages/guides/migration-v0x/migration-v0x.md
+++ b/docs/src/pages/guides/migration-v0x/migration-v0x.md
@@ -16,12 +16,12 @@ Material-UI was started [4 years ago](https://github.com/mui-org/material-ui/com
 The ecosystem has evolved a lot since then, we have also learned a lot.
 [@nathanmarks](https://github.com/nathanmarks/) started an ambitious task, rebuilding Material-UI from the **ground-up**
 taking advantage of this knowledge to address long-standing issues. To name some of the major changes:
-- New styling solution using CSS-in-JS (better [customization](/customization/overrides) power, better performance)
-- New [theme handling](/customization/themes) (nesting, self-supporting, etc.)
+- New styling solution using CSS-in-JS (better [customization](/customization/overrides/) power, better performance)
+- New [theme handling](/customization/themes/) (nesting, self-supporting, etc.)
 - Blazing fast documentation thanks to [Next.js](https://github.com/zeit/next.js)
-- Way better [test coverage](/guides/testing) (99%+, run on all the major browsers, [visual regression tests](https://www.argos-ci.com/mui-org/material-ui))
-- Full [server-side rendering](/guides/server-rendering) support
-- Wide range of [supported browsers](/getting-started/supported-platforms)
+- Way better [test coverage](/guides/testing/) (99%+, run on all the major browsers, [visual regression tests](https://www.argos-ci.com/mui-org/material-ui))
+- Full [server-side rendering](/guides/server-rendering/) support
+- Wide range of [supported browsers](/getting-started/supported-platforms/)
 
 ### Where should I start in a migration?
 
diff --git a/docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md b/docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md
index f0cea270906821..f094827ce38abd 100644
--- a/docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md
+++ b/docs/src/pages/guides/minimizing-bundle-size/minimizing-bundle-size.md
@@ -55,7 +55,7 @@ Pick one of the following plugins:
 
 ## ECMAScript
 
-The package published on npm is **transpiled**, with [Babel](https://github.com/babel/babel), to take into account the [supported platforms](/getting-started/supported-platforms).
+The package published on npm is **transpiled**, with [Babel](https://github.com/babel/babel), to take into account the [supported platforms](/getting-started/supported-platforms/).
 
 We also publish a second version of the components to target **evergreen browsers**.
 You can find this version under the [`/es` folder](https://unpkg.com/@material-ui/core/es/).
@@ -65,6 +65,6 @@ Older browsers will require more JavaScript features to be transpiled,
 which increases the size of the bundle.
 No polyfills are included for ES2015 runtime features. IE11+ and evergreen browsers support all the
 necessary features. If you need support for other browsers, consider using
-[`@babel/polyfill`](https://npmjs.com/package/@babel/polyfill).
+[`@babel/polyfill`](https://www.npmjs.com/package/@babel/polyfill).
 
 ⚠️ In order to minimize duplication of code in users' bundles, we **strongly discourage** library authors from using the `/es` folder.
diff --git a/docs/src/pages/lab/slider/slider.md b/docs/src/pages/lab/slider/slider.md
index 268eaab6f0e6d8..974e0c39ecaa65 100644
--- a/docs/src/pages/lab/slider/slider.md
+++ b/docs/src/pages/lab/slider/slider.md
@@ -7,7 +7,7 @@ components: Slider
 
 <p class="description">Sliders allow users to make selections from a range of values.</p>
 
-[Sliders](https://material.io/guidelines/components/sliders.html) reflect a range of values along a bar, from which users may select a single value. They are ideal for adjusting settings such as volume, brightness, or applying image filters.
+[Sliders](https://material.io/design/components/sliders.html) reflect a range of values along a bar, from which users may select a single value. They are ideal for adjusting settings such as volume, brightness, or applying image filters.
 
 Sliders can have icons on both ends of the bar that reflect a range of values.
 
@@ -37,4 +37,4 @@ Sliders reflect the current state of the settings they control.
 
 ## Custom thumb
 
-{{"demo": "pages/lab/slider/CustomIconSlider.js"}}
\ No newline at end of file
+{{"demo": "pages/lab/slider/CustomIconSlider.js"}}
diff --git a/docs/src/pages/layout/basics/basics.md b/docs/src/pages/layout/basics/basics.md
index 6512968611ec05..608fcbce61325a 100644
--- a/docs/src/pages/layout/basics/basics.md
+++ b/docs/src/pages/layout/basics/basics.md
@@ -7,13 +7,13 @@
 [Responsive layouts](https://material.io/design/layout/responsive-layout-grid.html) in Material Design adapt to any possible screen size.
 We provide the following helpers to make the UI responsive:
 
-- [Grid](/layout/grid):
+- [Grid](/layout/grid/):
 The grid creates visual consistency between layouts while allowing flexibility across a wide variety of designs.
 
-- [Hidden](/layout/hidden):
+- [Hidden](/layout/hidden/):
 The hidden component can be used to change the visibility of the elements.
 
-- [Breakpoints](/layout/breakpoints):
+- [Breakpoints](/layout/breakpoints/):
 We provide a low-level API for using the breakpoints in a wide variery of context.
 
 ## z-index
@@ -32,5 +32,5 @@ modals, snackbars, tooltips, and more.
 - tooltip: 1500
 
 These values can always be customized.
-You will find them in the theme under the [`zIndex`](/customization/default-theme?expend-path=$.zIndex) key.
+You will find them in the theme under the [`zIndex`](/customization/default-theme/?expend-path=$.zIndex) key.
 We don’t encourage customization of individual values; should you change one, you likely need to change them all.
diff --git a/docs/src/pages/layout/breakpoints/breakpoints.md b/docs/src/pages/layout/breakpoints/breakpoints.md
index d2bda16dfb7adc..fac29256e1e363 100644
--- a/docs/src/pages/layout/breakpoints/breakpoints.md
+++ b/docs/src/pages/layout/breakpoints/breakpoints.md
@@ -13,17 +13,17 @@ Each breakpoint matches with a *fixed* screen width:
 - **xl**, extra-large: 1920px or larger
 
 These values can always be customized.
-You will find them in the theme, in the [`breakpoints.values`](/customization/default-theme?expend-path=$.breakpoints.values) object.
+You will find them in the theme, in the [`breakpoints.values`](/customization/default-theme/?expend-path=$.breakpoints.values) object.
 
 The breakpoints are used internally in various components to make them responsive,
 but you can also take advantage of them
-for controlling the layout of your application through the [Grid](/layout/grid) and
-[Hidden](/layout/hidden) components.
+for controlling the layout of your application through the [Grid](/layout/grid/) and
+[Hidden](/layout/hidden/) components.
 
 ## Media Queries
 
 CSS media queries is the idiomatic approach to make your UI responsive.
-We provide some [CSS-in-JS](/customization/css-in-js) helpers to do so.
+We provide some [CSS-in-JS](/customization/css-in-js/) helpers to do so.
 
 In the following demo, we change the background color (red, blue & green) based on the screen width.
 
@@ -73,7 +73,7 @@ For instance, it can be used to defined a `getInitialProps()` static method (nex
   In some situation, you might want to use an heuristic to approximate
   the screen width of the client browser screen width.
   For instance, you could be using the user-agent or the client-hints.
-  http://caniuse.com/#search=client%20hint, we also can set the initial width
+  https://caniuse.com/#search=client%20hint, we also can set the initial width
   globally using [`custom properties`](/customization/themes/#properties) on the theme.
   In order to set the initialWidth we need to pass a custom property with this shape:
 
diff --git a/docs/src/pages/layout/hidden/hidden.md b/docs/src/pages/layout/hidden/hidden.md
index e7ff9786dcad69..086ebccd97ae4b 100644
--- a/docs/src/pages/layout/hidden/hidden.md
+++ b/docs/src/pages/layout/hidden/hidden.md
@@ -8,9 +8,9 @@ components: Hidden
 <p class="description">Quickly and responsively toggle the visibility value of components and more with our hidden utilities.</p>
 
 All elements are visible unless **they are explicitly hidden**.
-To ease integration with our [responsive breakpoints](/layout/basics),
+To ease integration with our [responsive breakpoints](/layout/basics/),
 this component can be used to hide any content,
-or you can use it in conjunction with our [`Grid`](/layout/grid) component.
+or you can use it in conjunction with our [`Grid`](/layout/grid/) component.
 
 ## How it works
 
@@ -32,7 +32,7 @@ mdDown      |                     hide | show
 
 ### js
 
-By default, the `js` implementation is used, responsively hiding content based on using the [`withWidth()`](/layout/breakpoints#withwidth-) higher-order component that watches screen size.
+By default, the `js` implementation is used, responsively hiding content based on using the [`withWidth()`](/layout/breakpoints/#withwidth-) higher-order component that watches screen size.
 This has the benefit of not rendering any content at all unless the breakpoint is met.
 
 ### css
diff --git a/docs/src/pages/style/color/color.md b/docs/src/pages/style/color/color.md
index 80675e8dbf88e5..ab131b451bc6bf 100644
--- a/docs/src/pages/style/color/color.md
+++ b/docs/src/pages/style/color/color.md
@@ -38,7 +38,7 @@ const accent2 = purple.A200; // #E040FB (alternative method)
 
 ## Color tool
 
-To test a [material.io/color](https://material.io/color) color scheme with the Material-UI
+To test a [material.io/color](https://material.io/design/color/) color scheme with the Material-UI
 documentation, simply select colors using the palette and sliders below.
 Alternatively, you can enter hex values in the Primary and Secondary text fields.
 
diff --git a/docs/src/pages/style/css-baseline/css-baseline.md b/docs/src/pages/style/css-baseline/css-baseline.md
index 7ac8b7d50fcbfb..95030408ff2a92 100644
--- a/docs/src/pages/style/css-baseline/css-baseline.md
+++ b/docs/src/pages/style/css-baseline/css-baseline.md
@@ -31,7 +31,7 @@ export default MyApp;
 The `<html>` and `<body>` elements are updated to provide better page-wide defaults. More specifically:
 - The margin in all browsers is removed.
 - The default Material Design background color is applied.
-It's using [`theme.palette.background.default`](/customization/default-theme?expend-path=$.palette.background) for standard devices and a white background for print devices.
+It's using [`theme.palette.background.default`](/customization/default-theme/?expend-path=$.palette.background) for standard devices and a white background for print devices.
 
 ### Layout
 
diff --git a/docs/src/pages/style/typography/typography.md b/docs/src/pages/style/typography/typography.md
index 169f2c76ed64cf..6b83ccbdc70a35 100644
--- a/docs/src/pages/style/typography/typography.md
+++ b/docs/src/pages/style/typography/typography.md
@@ -47,6 +47,6 @@ Material-UI default typography configuration only relies on 300, 400 and 500 fon
 ## Theme
 
 In some situations you might not be able to use the `Typography` component.
-Hopefully, you might be able to take advantage of the [`typography`](/customization/default-theme?expend-path=$.typography) keys of the theme.
+Hopefully, you might be able to take advantage of the [`typography`](/customization/default-theme/?expend-path=$.typography) keys of the theme.
 
 {{"demo": "pages/style/typography/TypographyTheme.js"}}
diff --git a/docs/src/pages/utils/modal/modal.md b/docs/src/pages/utils/modal/modal.md
index b88949ca24ea34..c8815f0a0e4c22 100644
--- a/docs/src/pages/utils/modal/modal.md
+++ b/docs/src/pages/utils/modal/modal.md
@@ -9,7 +9,7 @@ components: Modal
 
 The component renders its `children` node in front of a backdrop component.
 
-The `Modal` offers a few helpful features over using just a [`Portal`](/utils/portal)
+The `Modal` offers a few helpful features over using just a [`Portal`](/utils/portal/)
 component and some styles:
 - Manages dialog stacking when one-at-a-time just isn't enough.
 - Creates a backdrop, for disabling interaction below the modal.
diff --git a/docs/src/pages/utils/popover/popover.md b/docs/src/pages/utils/popover/popover.md
index bb8b7b8fbb0e7d..70bec0653664f3 100644
--- a/docs/src/pages/utils/popover/popover.md
+++ b/docs/src/pages/utils/popover/popover.md
@@ -8,8 +8,8 @@ components: Grow, Popover
 <p class="description">A Popover can be used to display some content on top of another.</p>
 
 Things to know when using the `Popover` component:
-- The component is built on top of the [`Modal`](/utils/modal) component.
-- The scroll and click away are blocked unlike with the [`Popper`](/utils/popper) component.
+- The component is built on top of the [`Modal`](/utils/modal/) component.
+- The scroll and click away are blocked unlike with the [`Popper`](/utils/popper/) component.
 
 ## Simple Popover
 
diff --git a/docs/src/pages/utils/popper/popper.md b/docs/src/pages/utils/popper/popper.md
index 01dfee53e22a07..743c689667ba0a 100644
--- a/docs/src/pages/utils/popper/popper.md
+++ b/docs/src/pages/utils/popper/popper.md
@@ -10,9 +10,9 @@ components: Popper
 Things to know when using the `Popper` component:
 
 - Poppers rely on the 3rd party library [Popper.js](https://github.com/FezVrasta/popper.js) for positioning.
-- The children is [`Portal`](/utils/portal) to the body of the document to avoid rendering problems.
+- The children is [`Portal`](/utils/portal/) to the body of the document to avoid rendering problems.
 You can disable this behavior with `disablePortal`.
-- The scroll and click away aren't blocked like with the [`Popover`](/utils/popover) component.
+- The scroll and click away aren't blocked like with the [`Popover`](/utils/popover/) component.
 The placement of the popper updates with the available area in the viewport.
 - The `anchorEl` is passed as the reference object to create a new `Popper.js` instance.
 
diff --git a/docs/src/pages/versions/versions.md b/docs/src/pages/versions/versions.md
index 907b816e2625cf..44b3f7ff8cb02a 100644
--- a/docs/src/pages/versions/versions.md
+++ b/docs/src/pages/versions/versions.md
@@ -21,7 +21,7 @@ We recognize that you need **stability** from the Material-UI library. Stability
 
 This document contains **the practices that we follow** to provide you with a leading-edge UI library, balanced with stability. We strive to ensure that future changes are always introduced in a predictable way. We want everyone who depends on Material-UI to know when and how new features are added, and to be well-prepared when obsolete ones are removed.
 
-Material-UI strictly follows [Semantic Versioning 2.0.0](http://semver.org/).
+Material-UI strictly follows [Semantic Versioning 2.0.0](https://semver.org/).
 Material-UI version numbers have three parts: `major.minor.patch`.
 The version number is incremented based on the level of change included in the release.
 
diff --git a/packages/material-ui/src/Hidden/Hidden.js b/packages/material-ui/src/Hidden/Hidden.js
index 2353f9e869ef4a..c9d83dbce628f8 100644
--- a/packages/material-ui/src/Hidden/Hidden.js
+++ b/packages/material-ui/src/Hidden/Hidden.js
@@ -39,7 +39,7 @@ Hidden.propTypes = {
    * the screen width of the client browser screen width.
    *
    * For instance, you could be using the user-agent or the client-hints.
-   * http://caniuse.com/#search=client%20hint
+   * https://caniuse.com/#search=client%20hint
    */
   initialWidth: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
   /**
diff --git a/packages/material-ui/src/Hidden/HiddenJs.js b/packages/material-ui/src/Hidden/HiddenJs.js
index 06e6d4b7a20b81..891e82b70914e0 100644
--- a/packages/material-ui/src/Hidden/HiddenJs.js
+++ b/packages/material-ui/src/Hidden/HiddenJs.js
@@ -73,7 +73,7 @@ HiddenJs.propTypes = {
    * the screen width of the client browser screen width.
    *
    * For instance, you could be using the user-agent or the client-hints.
-   * http://caniuse.com/#search=client%20hint
+   * https://caniuse.com/#search=client%20hint
    */
   initialWidth: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
   /**
diff --git a/packages/material-ui/src/IconButton/IconButton.js b/packages/material-ui/src/IconButton/IconButton.js
index e9687352768353..e01f9160ad0621 100644
--- a/packages/material-ui/src/IconButton/IconButton.js
+++ b/packages/material-ui/src/IconButton/IconButton.js
@@ -73,7 +73,7 @@ export const styles = theme => ({
 });
 
 /**
- * Refer to the [Icons](/style/icons) section of the documentation
+ * Refer to the [Icons](/style/icons/) section of the documentation
  * regarding the available icon options.
  */
 function IconButton(props) {
diff --git a/packages/material-ui/src/Select/Select.js b/packages/material-ui/src/Select/Select.js
index 44d75f271b6466..56eb3ec6212831 100644
--- a/packages/material-ui/src/Select/Select.js
+++ b/packages/material-ui/src/Select/Select.js
@@ -113,7 +113,7 @@ Select.propTypes = {
    */
   inputProps: PropTypes.object,
   /**
-   * Properties applied to the [`Menu`](/api/menu) element.
+   * Properties applied to the [`Menu`](/api/menu/) element.
    */
   MenuProps: PropTypes.object,
   /**
diff --git a/packages/material-ui/src/Select/SelectInput.js b/packages/material-ui/src/Select/SelectInput.js
index 7e3ce390a10528..96f0a6d8a26c6a 100644
--- a/packages/material-ui/src/Select/SelectInput.js
+++ b/packages/material-ui/src/Select/SelectInput.js
@@ -364,7 +364,7 @@ SelectInput.propTypes = {
    */
   inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
-   * Properties applied to the [`Menu`](/api/menu) element.
+   * Properties applied to the [`Menu`](/api/menu/) element.
    */
   MenuProps: PropTypes.object,
   /**
diff --git a/packages/material-ui/src/Slide/Slide.js b/packages/material-ui/src/Slide/Slide.js
index 871376cc9f2583..f0fb895464fb65 100644
--- a/packages/material-ui/src/Slide/Slide.js
+++ b/packages/material-ui/src/Slide/Slide.js
@@ -69,7 +69,7 @@ export function setTranslateValue(props, node) {
 }
 
 /**
- * The Slide transition is used by the [Snackbar](/demos/snackbars) component.
+ * The Slide transition is used by the [Snackbar](/demos/snackbars/) component.
  * It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
  */
 class Slide extends React.Component {
diff --git a/packages/material-ui/src/Snackbar/Snackbar.js b/packages/material-ui/src/Snackbar/Snackbar.js
index 8622a03d027183..821b0409996521 100644
--- a/packages/material-ui/src/Snackbar/Snackbar.js
+++ b/packages/material-ui/src/Snackbar/Snackbar.js
@@ -310,7 +310,7 @@ Snackbar.propTypes = {
    */
   ClickAwayListenerProps: PropTypes.object,
   /**
-   * Properties applied to the [`SnackbarContent`](/api/snackbar-content) element.
+   * Properties applied to the [`SnackbarContent`](/api/snackbar-content/) element.
    */
   ContentProps: PropTypes.object,
   /**
diff --git a/packages/material-ui/src/StepLabel/StepLabel.js b/packages/material-ui/src/StepLabel/StepLabel.js
index 83c8f592aa721f..83c61a77aab100 100644
--- a/packages/material-ui/src/StepLabel/StepLabel.js
+++ b/packages/material-ui/src/StepLabel/StepLabel.js
@@ -192,11 +192,11 @@ StepLabel.propTypes = {
    */
   orientation: PropTypes.oneOf(['horizontal', 'vertical']),
   /**
-   * The component to render in place of the [`StepIcon`](/api/step-icon).
+   * The component to render in place of the [`StepIcon`](/api/step-icon/).
    */
   StepIconComponent: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.object]),
   /**
-   * Properties applied to the [`StepIcon`](/api/step-icon) element.
+   * Properties applied to the [`StepIcon`](/api/step-icon/) element.
    */
   StepIconProps: PropTypes.object,
 };
diff --git a/packages/material-ui/src/withWidth/withWidth.js b/packages/material-ui/src/withWidth/withWidth.js
index 1894de1ceb8557..be7d99d7471c6c 100644
--- a/packages/material-ui/src/withWidth/withWidth.js
+++ b/packages/material-ui/src/withWidth/withWidth.js
@@ -136,7 +136,7 @@ const withWidth = (options = {}) => Component => {
      * the screen width of the client browser screen width.
      *
      * For instance, you could be using the user-agent or the client-hints.
-     * http://caniuse.com/#search=client%20hint
+     * https://caniuse.com/#search=client%20hint
      */
     initialWidth: PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl']),
     /**
diff --git a/pages/api/app-bar.md b/pages/api/app-bar.md
index a22079c2ee7f25..84dfefcc4a5baa 100644
--- a/pages/api/app-bar.md
+++ b/pages/api/app-bar.md
@@ -44,7 +44,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorPrimary</span> | Styles applied to the root element if `color="primary"`.
 | <span class="prop-name">colorSecondary</span> | Styles applied to the root element if `color="secondary"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/AppBar/AppBar.js)
 for more detail.
 
@@ -54,7 +54,7 @@ you need to use the following style sheet name: `MuiAppBar`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/avatar.md b/pages/api/avatar.md
index fcfc3e0f663a01..02bc383fb305f1 100644
--- a/pages/api/avatar.md
+++ b/pages/api/avatar.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorDefault</span> | Styles applied to the root element if `color="default"`.
 | <span class="prop-name">img</span> | Styles applied to the img element if either `src` or `srcSet` is defined.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Avatar/Avatar.js)
 for more detail.
 
diff --git a/pages/api/backdrop.md b/pages/api/backdrop.md
index 45ceaf4e30be10..2a9b1ca3aa5352 100644
--- a/pages/api/backdrop.md
+++ b/pages/api/backdrop.md
@@ -37,7 +37,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">invisible</span> | Styles applied to the root element if `invisible={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Backdrop/Backdrop.js)
 for more detail.
 
diff --git a/pages/api/badge.md b/pages/api/badge.md
index aa677e95d79589..5fd74cac63a61b 100644
--- a/pages/api/badge.md
+++ b/pages/api/badge.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorSecondary</span> | Styles applied to the root element if `color="secondary"`.
 | <span class="prop-name">colorError</span> | Styles applied to the root element if `color="error"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Badge/Badge.js)
 for more detail.
 
diff --git a/pages/api/bottom-navigation-action.md b/pages/api/bottom-navigation-action.md
index d71c9bb09edbac..b40a9cbafd1919 100644
--- a/pages/api/bottom-navigation-action.md
+++ b/pages/api/bottom-navigation-action.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">wrapper</span> | Styles applied to the span element that wraps the icon and label.
 | <span class="prop-name">label</span> | Styles applied to the label's span element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/BottomNavigationAction/BottomNavigationAction.js)
 for more detail.
 
@@ -52,7 +52,7 @@ you need to use the following style sheet name: `MuiBottomNavigationAction`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/bottom-navigation.md b/pages/api/bottom-navigation.md
index befa0c5b4bceb4..1d3bfd9079e409 100644
--- a/pages/api/bottom-navigation.md
+++ b/pages/api/bottom-navigation.md
@@ -37,7 +37,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/BottomNavigation/BottomNavigation.js)
 for more detail.
 
diff --git a/pages/api/button-base.md b/pages/api/button-base.md
index d2b0296f381eb5..dcc509d552dbdb 100644
--- a/pages/api/button-base.md
+++ b/pages/api/button-base.md
@@ -50,7 +50,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the root element if `disabled={true}`.
 | <span class="prop-name">focusVisible</span> | Styles applied to the root element if keyboard focused.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ButtonBase/ButtonBase.js)
 for more detail.
 
diff --git a/pages/api/button.md b/pages/api/button.md
index 4ffcc78740f803..a292ef1cd20ea5 100644
--- a/pages/api/button.md
+++ b/pages/api/button.md
@@ -69,7 +69,7 @@ This property accepts the following keys:
 | <span class="prop-name">sizeLarge</span> | Styles applied to the root element if `size="large"`.
 | <span class="prop-name">fullWidth</span> | Styles applied to the root element if `fullWidth={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Button/Button.js)
 for more detail.
 
@@ -79,7 +79,7 @@ you need to use the following style sheet name: `MuiButton`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/card-action-area.md b/pages/api/card-action-area.md
index 06b8db51f3023b..4040771dd04c7c 100644
--- a/pages/api/card-action-area.md
+++ b/pages/api/card-action-area.md
@@ -36,7 +36,7 @@ This property accepts the following keys:
 | <span class="prop-name">focusVisible</span> | Styles applied to the ButtonBase root element if the action area is keyboard focused.
 | <span class="prop-name">focusHighlight</span> | Styles applied to the overlay that covers the action area when it is keyboard focused.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CardActionArea/CardActionArea.js)
 for more detail.
 
@@ -46,7 +46,7 @@ you need to use the following style sheet name: `MuiCardActionArea`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/card-actions.md b/pages/api/card-actions.md
index 12e0c4f150c287..f2fe421d9a26ef 100644
--- a/pages/api/card-actions.md
+++ b/pages/api/card-actions.md
@@ -36,7 +36,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">action</span> | Styles applied to the children.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CardActions/CardActions.js)
 for more detail.
 
diff --git a/pages/api/card-content.md b/pages/api/card-content.md
index de523b03ffd2d0..77e1a8a3746589 100644
--- a/pages/api/card-content.md
+++ b/pages/api/card-content.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CardContent/CardContent.js)
 for more detail.
 
diff --git a/pages/api/card-header.md b/pages/api/card-header.md
index a5966e3f6d9235..0937c78a07a186 100644
--- a/pages/api/card-header.md
+++ b/pages/api/card-header.md
@@ -46,7 +46,7 @@ This property accepts the following keys:
 | <span class="prop-name">title</span> | Styles applied to the title Typography element.
 | <span class="prop-name">subheader</span> | Styles applied to the subheader Typography element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CardHeader/CardHeader.js)
 for more detail.
 
diff --git a/pages/api/card-media.md b/pages/api/card-media.md
index 66b13687cef83b..49ffd1e76e7043 100644
--- a/pages/api/card-media.md
+++ b/pages/api/card-media.md
@@ -37,7 +37,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">media</span> | Styles applied to the root element if `component="video, audio, picture, iframe, or img"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CardMedia/CardMedia.js)
 for more detail.
 
diff --git a/pages/api/card.md b/pages/api/card.md
index d54ac06c8f35ce..c3fdfa98cc136c 100644
--- a/pages/api/card.md
+++ b/pages/api/card.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Card/Card.js)
 for more detail.
 
@@ -44,7 +44,7 @@ you need to use the following style sheet name: `MuiCard`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/checkbox.md b/pages/api/checkbox.md
index 8a0b1157add6e8..22dbef663b64e0 100644
--- a/pages/api/checkbox.md
+++ b/pages/api/checkbox.md
@@ -52,7 +52,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorPrimary</span> | Styles applied to the root element if `color="primary"`.
 | <span class="prop-name">colorSecondary</span> | Styles applied to the root element if `color="secondary"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Checkbox/Checkbox.js)
 for more detail.
 
diff --git a/pages/api/chip.md b/pages/api/chip.md
index 8cd30d81abe29e..2cf9532d7bc6bc 100644
--- a/pages/api/chip.md
+++ b/pages/api/chip.md
@@ -67,7 +67,7 @@ This property accepts the following keys:
 | <span class="prop-name">deleteIconOutlinedColorPrimary</span> | Styles applied to the deleteIcon element if `color="primary"` and `variant="outlined"`.
 | <span class="prop-name">deleteIconOutlinedColorSecondary</span> | Styles applied to the deleteIcon element if `color="secondary"` and `variant="outlined"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Chip/Chip.js)
 for more detail.
 
diff --git a/pages/api/circular-progress.md b/pages/api/circular-progress.md
index aa0c847b2b82e9..70b267af98641f 100644
--- a/pages/api/circular-progress.md
+++ b/pages/api/circular-progress.md
@@ -50,7 +50,7 @@ This property accepts the following keys:
 | <span class="prop-name">circleStatic</span> | Styles applied to the `circle` svg path if `variant="static"`.
 | <span class="prop-name">circleIndeterminate</span> | Styles applied to the `circle` svg path if `variant="indeterminate"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/CircularProgress/CircularProgress.js)
 for more detail.
 
diff --git a/pages/api/click-away-listener.md b/pages/api/click-away-listener.md
index ec1bf92467dafd..1a18c2ff766b70 100644
--- a/pages/api/click-away-listener.md
+++ b/pages/api/click-away-listener.md
@@ -29,7 +29,7 @@ Any other properties supplied will be spread to the root element ([EventListener
 
 ## Inheritance
 
-The properties of the [EventListener](https://github.com/oliviertassinari/react-event-listener) component, from react-event-listener, are also available.
+The properties of the [EventListener](https://github.com/oliviertassinari/react-event-listener/) component, from react-event-listener, are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/collapse.md b/pages/api/collapse.md
index e452cfb08b9bef..14dc12ff314b0b 100644
--- a/pages/api/collapse.md
+++ b/pages/api/collapse.md
@@ -43,7 +43,7 @@ This property accepts the following keys:
 | <span class="prop-name">wrapper</span> | Styles applied to the outer wrapper element.
 | <span class="prop-name">wrapperInner</span> | Styles applied to the inner wrapper element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Collapse/Collapse.js)
 for more detail.
 
diff --git a/pages/api/dialog-actions.md b/pages/api/dialog-actions.md
index 32b8c3cb773817..a0fcc2e5768ef8 100644
--- a/pages/api/dialog-actions.md
+++ b/pages/api/dialog-actions.md
@@ -36,7 +36,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">action</span> | Styles applied to the children.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/DialogActions/DialogActions.js)
 for more detail.
 
diff --git a/pages/api/dialog-content-text.md b/pages/api/dialog-content-text.md
index ffcf96a346b8a9..5a03237df76fa6 100644
--- a/pages/api/dialog-content-text.md
+++ b/pages/api/dialog-content-text.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/DialogContentText/DialogContentText.js)
 for more detail.
 
@@ -44,7 +44,7 @@ you need to use the following style sheet name: `MuiDialogContentText`.
 
 ## Inheritance
 
-The properties of the [Typography](/api/typography) component are also available.
+The properties of the [Typography](/api/typography/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/dialog-content.md b/pages/api/dialog-content.md
index 87df88768d303d..fde57a6fa854b2 100644
--- a/pages/api/dialog-content.md
+++ b/pages/api/dialog-content.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/DialogContent/DialogContent.js)
 for more detail.
 
diff --git a/pages/api/dialog-title.md b/pages/api/dialog-title.md
index 08576e8a966d8b..b16782dfc18743 100644
--- a/pages/api/dialog-title.md
+++ b/pages/api/dialog-title.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/DialogTitle/DialogTitle.js)
 for more detail.
 
diff --git a/pages/api/dialog.md b/pages/api/dialog.md
index d6c2ef27eeeca1..e182de0133fccd 100644
--- a/pages/api/dialog.md
+++ b/pages/api/dialog.md
@@ -65,7 +65,7 @@ This property accepts the following keys:
 | <span class="prop-name">paperFullWidth</span> | Styles applied to the `Paper` component if `fullWidth={true}`.
 | <span class="prop-name">paperFullScreen</span> | Styles applied to the `Paper` component if `fullScreen={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Dialog/Dialog.js)
 for more detail.
 
@@ -75,7 +75,7 @@ you need to use the following style sheet name: `MuiDialog`.
 
 ## Inheritance
 
-The properties of the [Modal](/api/modal) component are also available.
+The properties of the [Modal](/api/modal/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/divider.md b/pages/api/divider.md
index 79ecb1a5959049..322e1dac70572c 100644
--- a/pages/api/divider.md
+++ b/pages/api/divider.md
@@ -40,7 +40,7 @@ This property accepts the following keys:
 | <span class="prop-name">inset</span> | Styles applied to the root element if `inset={true}`.
 | <span class="prop-name">light</span> | Styles applied to the root element if `light={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Divider/Divider.js)
 for more detail.
 
diff --git a/pages/api/drawer.md b/pages/api/drawer.md
index 5ca0e7556a5de3..31471cbd6b1e24 100644
--- a/pages/api/drawer.md
+++ b/pages/api/drawer.md
@@ -54,7 +54,7 @@ This property accepts the following keys:
 | <span class="prop-name">paperAnchorDockedBottom</span> | Styles applied to the `Paper` component if `anchor="bottom"` & `variant` is not "temporary".
 | <span class="prop-name">modal</span> | Styles applied to the `Modal` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Drawer/Drawer.js)
 for more detail.
 
diff --git a/pages/api/expansion-panel-actions.md b/pages/api/expansion-panel-actions.md
index 3439f4c617a930..c37de8289a113f 100644
--- a/pages/api/expansion-panel-actions.md
+++ b/pages/api/expansion-panel-actions.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">action</span> | Styles applied to the children.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ExpansionPanelActions/ExpansionPanelActions.js)
 for more detail.
 
diff --git a/pages/api/expansion-panel-details.md b/pages/api/expansion-panel-details.md
index cf6a54c3742882..ce3bfbdae5510b 100644
--- a/pages/api/expansion-panel-details.md
+++ b/pages/api/expansion-panel-details.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ExpansionPanelDetails/ExpansionPanelDetails.js)
 for more detail.
 
diff --git a/pages/api/expansion-panel-summary.md b/pages/api/expansion-panel-summary.md
index 9d4279604ff9db..a54d9199cfe6a0 100644
--- a/pages/api/expansion-panel-summary.md
+++ b/pages/api/expansion-panel-summary.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">content</span> | Styles applied to the children wrapper element.
 | <span class="prop-name">expandIcon</span> | Styles applied to the `IconButton` component when `expandIcon` is supplied.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ExpansionPanelSummary/ExpansionPanelSummary.js)
 for more detail.
 
@@ -51,7 +51,7 @@ you need to use the following style sheet name: `MuiExpansionPanelSummary`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/expansion-panel.md b/pages/api/expansion-panel.md
index 958ffa22510082..24a265d497ccf2 100644
--- a/pages/api/expansion-panel.md
+++ b/pages/api/expansion-panel.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">expanded</span> | Styles applied to the root element if `expanded={true}`.
 | <span class="prop-name">disabled</span> | Styles applied to the root element if `disabled={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ExpansionPanel/ExpansionPanel.js)
 for more detail.
 
@@ -51,7 +51,7 @@ you need to use the following style sheet name: `MuiExpansionPanel`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/filled-input.md b/pages/api/filled-input.md
index c85b4d6efb980b..6e1bab96255ae1 100644
--- a/pages/api/filled-input.md
+++ b/pages/api/filled-input.md
@@ -69,7 +69,7 @@ This property accepts the following keys:
 | <span class="prop-name">inputAdornedStart</span> | Styles applied to the `input` element if `startAdornment` is provided.
 | <span class="prop-name">inputAdornedEnd</span> | Styles applied to the `input` element if `endAdornment` is provided.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FilledInput/FilledInput.js)
 for more detail.
 
@@ -79,7 +79,7 @@ you need to use the following style sheet name: `MuiFilledInput`.
 
 ## Inheritance
 
-The properties of the [InputBase](/api/input-base) component are also available.
+The properties of the [InputBase](/api/input-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/form-control-label.md b/pages/api/form-control-label.md
index 5db33df5379d5d..ad8ca3f337456b 100644
--- a/pages/api/form-control-label.md
+++ b/pages/api/form-control-label.md
@@ -46,7 +46,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the root element if `disabled={true}`.
 | <span class="prop-name">label</span> | Styles applied to the label's Typography component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FormControlLabel/FormControlLabel.js)
 for more detail.
 
diff --git a/pages/api/form-control.md b/pages/api/form-control.md
index 72d0a23be35a83..ee0b07b3a21f0b 100644
--- a/pages/api/form-control.md
+++ b/pages/api/form-control.md
@@ -51,7 +51,7 @@ This property accepts the following keys:
 | <span class="prop-name">marginDense</span> | Styles applied to the root element if `margin="dense"`.
 | <span class="prop-name">fullWidth</span> | Styles applied to the root element if `fullWidth={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FormControl/FormControl.js)
 for more detail.
 
diff --git a/pages/api/form-group.md b/pages/api/form-group.md
index 9b37e7fdadd7d0..022dd79d0a3895 100644
--- a/pages/api/form-group.md
+++ b/pages/api/form-group.md
@@ -38,7 +38,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">row</span> | Styles applied to the root element if `row={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FormGroup/FormGroup.js)
 for more detail.
 
diff --git a/pages/api/form-helper-text.md b/pages/api/form-helper-text.md
index 9c8f25efe6722b..a034f10efbdae0 100644
--- a/pages/api/form-helper-text.md
+++ b/pages/api/form-helper-text.md
@@ -49,7 +49,7 @@ This property accepts the following keys:
 | <span class="prop-name">filled</span> | Styles applied to the root element if `filled={true}`.
 | <span class="prop-name">required</span> | Styles applied to the root element if `required={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FormHelperText/FormHelperText.js)
 for more detail.
 
diff --git a/pages/api/form-label.md b/pages/api/form-label.md
index bd8a04fc39fd0d..37da8b89f5aea2 100644
--- a/pages/api/form-label.md
+++ b/pages/api/form-label.md
@@ -46,7 +46,7 @@ This property accepts the following keys:
 | <span class="prop-name">required</span> | Styles applied to the root element if `required={true}`.
 | <span class="prop-name">asterisk</span> | 
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/FormLabel/FormLabel.js)
 for more detail.
 
diff --git a/pages/api/grid-list-tile-bar.md b/pages/api/grid-list-tile-bar.md
index 4f52679b25894e..7ecc0269df92a3 100644
--- a/pages/api/grid-list-tile-bar.md
+++ b/pages/api/grid-list-tile-bar.md
@@ -48,7 +48,7 @@ This property accepts the following keys:
 | <span class="prop-name">actionIcon</span> | Styles applied to the actionIcon if supplied.
 | <span class="prop-name">actionIconActionPosLeft</span> | Styles applied to the actionIcon if `actionPosition="left".
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/GridListTileBar/GridListTileBar.js)
 for more detail.
 
diff --git a/pages/api/grid-list-tile.md b/pages/api/grid-list-tile.md
index 562a0e95bb596d..5d3c1246899510 100644
--- a/pages/api/grid-list-tile.md
+++ b/pages/api/grid-list-tile.md
@@ -40,7 +40,7 @@ This property accepts the following keys:
 | <span class="prop-name">imgFullHeight</span> | Styles applied to an `ing` element child, if if needed to ensure it covers the tile.
 | <span class="prop-name">imgFullWidth</span> | Styles applied to an `ing` element child, if if needed to ensure it covers the tile.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/GridListTile/GridListTile.js)
 for more detail.
 
diff --git a/pages/api/grid-list.md b/pages/api/grid-list.md
index 745c05dfb43bb9..4480626c2735fe 100644
--- a/pages/api/grid-list.md
+++ b/pages/api/grid-list.md
@@ -38,7 +38,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/GridList/GridList.js)
 for more detail.
 
diff --git a/pages/api/grid.md b/pages/api/grid.md
index 21b134b8d66862..78817e75a1dd7e 100644
--- a/pages/api/grid.md
+++ b/pages/api/grid.md
@@ -89,7 +89,7 @@ This property accepts the following keys:
 | <span class="prop-name">grid-xs-11</span> | 
 | <span class="prop-name">grid-xs-12</span> | 
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Grid/Grid.js)
 for more detail.
 
diff --git a/pages/api/hidden.md b/pages/api/hidden.md
index dadf0d9f825729..75ac7325242035 100644
--- a/pages/api/hidden.md
+++ b/pages/api/hidden.md
@@ -21,7 +21,7 @@ Responsively hides children based on the selected implementation.
 |:-----|:-----|:--------|:------------|
 | <span class="prop-name">children</span> | <span class="prop-type">node |   | The content of the component. |
 | <span class="prop-name">implementation</span> | <span class="prop-type">enum:&nbsp;'js'&nbsp;&#124;<br>&nbsp;'css'<br> | <span class="prop-default">'js'</span> | Specify which implementation to use.  'js' is the default, 'css' works better for server side rendering. |
-| <span class="prop-name">initialWidth</span> | <span class="prop-type">enum:&nbsp;'xs', 'sm', 'md', 'lg', 'xl'<br> |   | You can use this property when choosing the `js` implementation with server side rendering.<br>As `window.innerWidth` is unavailable on the server, we default to rendering an empty componenent during the first mount. In some situation you might want to use an heristic to approximate the screen width of the client browser screen width.<br>For instance, you could be using the user-agent or the client-hints. http://caniuse.com/#search=client%20hint |
+| <span class="prop-name">initialWidth</span> | <span class="prop-type">enum:&nbsp;'xs', 'sm', 'md', 'lg', 'xl'<br> |   | You can use this property when choosing the `js` implementation with server side rendering.<br>As `window.innerWidth` is unavailable on the server, we default to rendering an empty componenent during the first mount. In some situation you might want to use an heristic to approximate the screen width of the client browser screen width.<br>For instance, you could be using the user-agent or the client-hints. https://caniuse.com/#search=client%20hint |
 | <span class="prop-name">lgDown</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If true, screens this size and down will be hidden. |
 | <span class="prop-name">lgUp</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If true, screens this size and up will be hidden. |
 | <span class="prop-name">mdDown</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If true, screens this size and down will be hidden. |
diff --git a/pages/api/icon-button.md b/pages/api/icon-button.md
index a7d2cecca8a68f..592c9a156bac76 100644
--- a/pages/api/icon-button.md
+++ b/pages/api/icon-button.md
@@ -13,7 +13,7 @@ title: IconButton API
 import IconButton from '@material-ui/core/IconButton';
 ```
 
-Refer to the [Icons](/style/icons) section of the documentation
+Refer to the [Icons](/style/icons/) section of the documentation
 regarding the available icon options.
 
 ## Props
@@ -43,7 +43,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the root element if `disabled={true}`.
 | <span class="prop-name">label</span> | Styles applied to the children container element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/IconButton/IconButton.js)
 for more detail.
 
@@ -53,7 +53,7 @@ you need to use the following style sheet name: `MuiIconButton`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/icon.md b/pages/api/icon.md
index 701104b359f592..216991cf14c3ef 100644
--- a/pages/api/icon.md
+++ b/pages/api/icon.md
@@ -45,7 +45,7 @@ This property accepts the following keys:
 | <span class="prop-name">fontSizeSmall</span> | Styles applied to the root element if `fontSize="small"`.
 | <span class="prop-name">fontSizeLarge</span> | Styles applied to the root element if `fontSize="large"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Icon/Icon.js)
 for more detail.
 
diff --git a/pages/api/input-adornment.md b/pages/api/input-adornment.md
index 4bbc6ab4a8f962..6664b7d972882e 100644
--- a/pages/api/input-adornment.md
+++ b/pages/api/input-adornment.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">positionStart</span> | Styles applied to the root element if `position="start"`.
 | <span class="prop-name">positionEnd</span> | Styles applied to the root element if `position="end"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/InputAdornment/InputAdornment.js)
 for more detail.
 
diff --git a/pages/api/input-base.md b/pages/api/input-base.md
index 2edf9caa41c0f9..d7532d34b37de4 100644
--- a/pages/api/input-base.md
+++ b/pages/api/input-base.md
@@ -75,7 +75,7 @@ This property accepts the following keys:
 | <span class="prop-name">inputAdornedStart</span> | Styles applied to the `input` element if `startAdornment` is provided.
 | <span class="prop-name">inputAdornedEnd</span> | Styles applied to the `input` element if `endAdornment` is provided.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/InputBase/InputBase.js)
 for more detail.
 
diff --git a/pages/api/input-label.md b/pages/api/input-label.md
index 10c6f15d16c1f5..7b3101fe2c0689 100644
--- a/pages/api/input-label.md
+++ b/pages/api/input-label.md
@@ -49,7 +49,7 @@ This property accepts the following keys:
 | <span class="prop-name">filled</span> | Styles applied to the root element if `variant="filled"`.
 | <span class="prop-name">outlined</span> | Styles applied to the root element if `variant="outlined"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/InputLabel/InputLabel.js)
 for more detail.
 
@@ -59,7 +59,7 @@ you need to use the following style sheet name: `MuiInputLabel`.
 
 ## Inheritance
 
-The properties of the [FormLabel](/api/form-label) component are also available.
+The properties of the [FormLabel](/api/form-label/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/input.md b/pages/api/input.md
index 8b91dcb61f2bd8..0b6abc56a97390 100644
--- a/pages/api/input.md
+++ b/pages/api/input.md
@@ -70,7 +70,7 @@ This property accepts the following keys:
 | <span class="prop-name">inputType</span> | Styles applied to the `input` element if `type` is not "text"`.
 | <span class="prop-name">inputTypeSearch</span> | Styles applied to the `input` element if `type="search"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Input/Input.js)
 for more detail.
 
@@ -80,7 +80,7 @@ you need to use the following style sheet name: `MuiInput`.
 
 ## Inheritance
 
-The properties of the [InputBase](/api/input-base) component are also available.
+The properties of the [InputBase](/api/input-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/linear-progress.md b/pages/api/linear-progress.md
index b58f5923731a0a..10a84e59bde65e 100644
--- a/pages/api/linear-progress.md
+++ b/pages/api/linear-progress.md
@@ -57,7 +57,7 @@ This property accepts the following keys:
 | <span class="prop-name">bar2Determinate</span> | Styles applied to the bar2 element if `variant="determinate"`.
 | <span class="prop-name">bar2Buffer</span> | Styles applied to the bar2 element if `variant="buffer"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/LinearProgress/LinearProgress.js)
 for more detail.
 
diff --git a/pages/api/list-item-avatar.md b/pages/api/list-item-avatar.md
index 24a560146f2f8f..2b0ecbe8fda91c 100644
--- a/pages/api/list-item-avatar.md
+++ b/pages/api/list-item-avatar.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">icon</span> | Styles applied to the children – typically the `Avatar` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListItemAvatar/ListItemAvatar.js)
 for more detail.
 
diff --git a/pages/api/list-item-icon.md b/pages/api/list-item-icon.md
index 818bdfd80db5b6..253e98c16c5c6c 100644
--- a/pages/api/list-item-icon.md
+++ b/pages/api/list-item-icon.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListItemIcon/ListItemIcon.js)
 for more detail.
 
diff --git a/pages/api/list-item-secondary-action.md b/pages/api/list-item-secondary-action.md
index 0eed7275c1c646..2c123293171948 100644
--- a/pages/api/list-item-secondary-action.md
+++ b/pages/api/list-item-secondary-action.md
@@ -34,7 +34,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListItemSecondaryAction/ListItemSecondaryAction.js)
 for more detail.
 
diff --git a/pages/api/list-item-text.md b/pages/api/list-item-text.md
index c873d4ab9ba446..ed215b87640d0d 100644
--- a/pages/api/list-item-text.md
+++ b/pages/api/list-item-text.md
@@ -45,7 +45,7 @@ This property accepts the following keys:
 | <span class="prop-name">secondary</span> | Styles applied to the secondary `Typography` component.
 | <span class="prop-name">textDense</span> | Styles applied to the `Typography` components if `context.dense` is `true`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListItemText/ListItemText.js)
 for more detail.
 
diff --git a/pages/api/list-item.md b/pages/api/list-item.md
index 4f8a1b9e8696fa..32e87d6f080b9b 100644
--- a/pages/api/list-item.md
+++ b/pages/api/list-item.md
@@ -53,7 +53,7 @@ This property accepts the following keys:
 | <span class="prop-name">secondaryAction</span> | Styles applied to the `component` element if `children` includes `ListItemSecondaryAction`.
 | <span class="prop-name">selected</span> | Styles applied to the root element if `selected={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListItem/ListItem.js)
 for more detail.
 
diff --git a/pages/api/list-subheader.md b/pages/api/list-subheader.md
index 3e8e2f5cee43b0..9af04e9a0746d7 100644
--- a/pages/api/list-subheader.md
+++ b/pages/api/list-subheader.md
@@ -44,7 +44,7 @@ This property accepts the following keys:
 | <span class="prop-name">inset</span> | Styles applied to the root element if `inset={true}`.
 | <span class="prop-name">sticky</span> | Styles applied to the root element if `disableSticky={false}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ListSubheader/ListSubheader.js)
 for more detail.
 
diff --git a/pages/api/list.md b/pages/api/list.md
index 986b736803ff66..d6b5cf11c48f14 100644
--- a/pages/api/list.md
+++ b/pages/api/list.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">dense</span> | Styles applied to the root element if `dense={true}` & `disablePadding={false}`.
 | <span class="prop-name">subheader</span> | Styles applied to the root element if a `subheader` is provided.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/List/List.js)
 for more detail.
 
diff --git a/pages/api/menu-item.md b/pages/api/menu-item.md
index c214f57f07ecb5..e9652650b71567 100644
--- a/pages/api/menu-item.md
+++ b/pages/api/menu-item.md
@@ -36,7 +36,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">selected</span> | Styles applied to the root element if `selected={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/MenuItem/MenuItem.js)
 for more detail.
 
@@ -46,7 +46,7 @@ you need to use the following style sheet name: `MuiMenuItem`.
 
 ## Inheritance
 
-The properties of the [ListItem](/api/list-item) component are also available.
+The properties of the [ListItem](/api/list-item/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/menu-list.md b/pages/api/menu-list.md
index 052a63fba26e28..cc9dbd3f9451a5 100644
--- a/pages/api/menu-list.md
+++ b/pages/api/menu-list.md
@@ -25,7 +25,7 @@ Any other properties supplied will be spread to the root element ([List](/api/li
 
 ## Inheritance
 
-The properties of the [List](/api/list) component are also available.
+The properties of the [List](/api/list/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/menu.md b/pages/api/menu.md
index 4dfc1cb6cfade9..1de801004c990e 100644
--- a/pages/api/menu.md
+++ b/pages/api/menu.md
@@ -47,7 +47,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">paper</span> | Styles applied to the `Paper` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Menu/Menu.js)
 for more detail.
 
@@ -57,7 +57,7 @@ you need to use the following style sheet name: `MuiMenu`.
 
 ## Inheritance
 
-The properties of the [Popover](/api/popover) component are also available.
+The properties of the [Popover](/api/popover/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/mobile-stepper.md b/pages/api/mobile-stepper.md
index 8f41d5b6b3e5eb..a1b2608118649f 100644
--- a/pages/api/mobile-stepper.md
+++ b/pages/api/mobile-stepper.md
@@ -47,7 +47,7 @@ This property accepts the following keys:
 | <span class="prop-name">dotActive</span> | Styles applied to a dot if `variant="dots"` and this is the active step.
 | <span class="prop-name">progress</span> | Styles applied to the Linear Progress component if `variant="progress"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/MobileStepper/MobileStepper.js)
 for more detail.
 
@@ -57,7 +57,7 @@ you need to use the following style sheet name: `MuiMobileStepper`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/modal.md b/pages/api/modal.md
index 6461005693f821..31fe3e82962cf6 100644
--- a/pages/api/modal.md
+++ b/pages/api/modal.md
@@ -52,7 +52,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">hidden</span> | Styles applied to the root element if the `Modal` has exited.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Modal/Modal.js)
 for more detail.
 
diff --git a/pages/api/native-select.md b/pages/api/native-select.md
index 24b5355a3a7fec..deb8d735b63f0e 100644
--- a/pages/api/native-select.md
+++ b/pages/api/native-select.md
@@ -46,7 +46,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the `Input` component `disabled` class.
 | <span class="prop-name">icon</span> | Styles applied to the `Input` component `icon` class.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/NativeSelect/NativeSelect.js)
 for more detail.
 
@@ -56,7 +56,7 @@ you need to use the following style sheet name: `MuiNativeSelect`.
 
 ## Inheritance
 
-The properties of the [Input](/api/input) component are also available.
+The properties of the [Input](/api/input/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/outlined-input.md b/pages/api/outlined-input.md
index adfc99e08e9fae..f25c83af65b6ae 100644
--- a/pages/api/outlined-input.md
+++ b/pages/api/outlined-input.md
@@ -71,7 +71,7 @@ This property accepts the following keys:
 | <span class="prop-name">inputAdornedStart</span> | Styles applied to the `input` element if `startAdornment` is provided.
 | <span class="prop-name">inputAdornedEnd</span> | Styles applied to the `input` element if `endAdornment` is provided.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/OutlinedInput/OutlinedInput.js)
 for more detail.
 
@@ -81,7 +81,7 @@ you need to use the following style sheet name: `MuiOutlinedInput`.
 
 ## Inheritance
 
-The properties of the [InputBase](/api/input-base) component are also available.
+The properties of the [InputBase](/api/input-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/paper.md b/pages/api/paper.md
index e33c3687bbe673..9a4b4ade55adf0 100644
--- a/pages/api/paper.md
+++ b/pages/api/paper.md
@@ -63,7 +63,7 @@ This property accepts the following keys:
 | <span class="prop-name">elevation23</span> | 
 | <span class="prop-name">elevation24</span> | 
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Paper/Paper.js)
 for more detail.
 
diff --git a/pages/api/popover.md b/pages/api/popover.md
index 82ae02fbf226bf..3bd12809f68b4d 100644
--- a/pages/api/popover.md
+++ b/pages/api/popover.md
@@ -57,7 +57,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">paper</span> | Styles applied to the `Paper` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Popover/Popover.js)
 for more detail.
 
@@ -67,7 +67,7 @@ you need to use the following style sheet name: `MuiPopover`.
 
 ## Inheritance
 
-The properties of the [Modal](/api/modal) component are also available.
+The properties of the [Modal](/api/modal/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/radio-group.md b/pages/api/radio-group.md
index d0f85dab881888..4fa3fbbf48ab24 100644
--- a/pages/api/radio-group.md
+++ b/pages/api/radio-group.md
@@ -28,7 +28,7 @@ Any other properties supplied will be spread to the root element ([FormGroup](/a
 
 ## Inheritance
 
-The properties of the [FormGroup](/api/form-group) component are also available.
+The properties of the [FormGroup](/api/form-group/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/radio.md b/pages/api/radio.md
index ab303e1ff64f30..96fdb0011d54e2 100644
--- a/pages/api/radio.md
+++ b/pages/api/radio.md
@@ -49,7 +49,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorPrimary</span> | Styles applied to the root element if `color="primary"`.
 | <span class="prop-name">colorSecondary</span> | Styles applied to the root element if `color="secondary"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Radio/Radio.js)
 for more detail.
 
diff --git a/pages/api/select.md b/pages/api/select.md
index 7138a1fa40b11d..bf44e768f648ef 100644
--- a/pages/api/select.md
+++ b/pages/api/select.md
@@ -26,7 +26,7 @@ import Select from '@material-ui/core/Select';
 | <span class="prop-name">IconComponent</span> | <span class="prop-type">union:&nbsp;string&nbsp;&#124;<br>&nbsp;func&nbsp;&#124;<br>&nbsp;object<br> | <span class="prop-default">ArrowDropDownIcon</span> | The icon that displays the arrow. |
 | <span class="prop-name">input</span> | <span class="prop-type">element | <span class="prop-default">&lt;Input /></span> | An `Input` element; does not have to be a material-ui specific `Input`. |
 | <span class="prop-name">inputProps</span> | <span class="prop-type">object |   | Attributes applied to the `input` element. When `native` is `true`, the attributes are applied on the `select` element. |
-| <span class="prop-name">MenuProps</span> | <span class="prop-type">object |   | Properties applied to the [`Menu`](/api/menu) element. |
+| <span class="prop-name">MenuProps</span> | <span class="prop-type">object |   | Properties applied to the [`Menu`](/api/menu/) element. |
 | <span class="prop-name">multiple</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If true, `value` must be an array and the menu will support multiple selections. You can only use it when the `native` property is `false` (default). |
 | <span class="prop-name">native</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If `true`, the component will be using a native `select` element. |
 | <span class="prop-name">onChange</span> | <span class="prop-type">func |   | Callback function fired when a menu item is selected.<br><br>**Signature:**<br>`function(event: object, child?: object) => void`<br>*event:* The event source of the callback. You can pull out the new value by accessing `event.target.value`.<br>*child:* The react element that was selected when `native` is `false` (default). |
@@ -56,7 +56,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the `Input` component `disabled` class.
 | <span class="prop-name">icon</span> | Styles applied to the `Input` component `icon` class.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Select/Select.js)
 for more detail.
 
@@ -66,7 +66,7 @@ you need to use the following style sheet name: `MuiSelect`.
 
 ## Inheritance
 
-The properties of the [Input](/api/input) component are also available.
+The properties of the [Input](/api/input/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/slide.md b/pages/api/slide.md
index 6f92bf4bac5c0e..16522a35fc7e73 100644
--- a/pages/api/slide.md
+++ b/pages/api/slide.md
@@ -13,7 +13,7 @@ title: Slide API
 import Slide from '@material-ui/core/Slide';
 ```
 
-The Slide transition is used by the [Snackbar](/demos/snackbars) component.
+The Slide transition is used by the [Snackbar](/demos/snackbars/) component.
 It uses [react-transition-group](https://github.com/reactjs/react-transition-group) internally.
 
 ## Props
diff --git a/pages/api/snackbar-content.md b/pages/api/snackbar-content.md
index e3250aa20399e2..68a60e0e5115a4 100644
--- a/pages/api/snackbar-content.md
+++ b/pages/api/snackbar-content.md
@@ -37,7 +37,7 @@ This property accepts the following keys:
 | <span class="prop-name">message</span> | Styles applied to the message wrapper element.
 | <span class="prop-name">action</span> | Styles applied to the action wrapper element if `action` is provided.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/SnackbarContent/SnackbarContent.js)
 for more detail.
 
@@ -47,7 +47,7 @@ you need to use the following style sheet name: `MuiSnackbarContent`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/snackbar.md b/pages/api/snackbar.md
index 32b5a4558b93c7..8a1285515abeef 100644
--- a/pages/api/snackbar.md
+++ b/pages/api/snackbar.md
@@ -25,7 +25,7 @@ import Snackbar from '@material-ui/core/Snackbar';
 | <span class="prop-name">children</span> | <span class="prop-type">element |   | If you wish the take control over the children of the component you can use this property. When used, you replace the `SnackbarContent` component with the children. |
 | <span class="prop-name">classes</span> | <span class="prop-type">object |   | Override or extend the styles applied to the component. See [CSS API](#css-api) below for more details. |
 | <span class="prop-name">ClickAwayListenerProps</span> | <span class="prop-type">object |   | Properties applied to the `ClickAwayListener` element. |
-| <span class="prop-name">ContentProps</span> | <span class="prop-type">object |   | Properties applied to the [`SnackbarContent`](/api/snackbar-content) element. |
+| <span class="prop-name">ContentProps</span> | <span class="prop-type">object |   | Properties applied to the [`SnackbarContent`](/api/snackbar-content/) element. |
 | <span class="prop-name">disableWindowBlurListener</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | If `true`, the `autoHideDuration` timer will expire even if the window is not focused. |
 | <span class="prop-name">key</span> | <span class="prop-type">any |   | When displaying multiple consecutive Snackbars from a parent rendering a single &lt;Snackbar/>, add the key property to ensure independent treatment of each message. e.g. &lt;Snackbar key={message} />, otherwise, the message may update-in-place and features such as autoHideDuration may be canceled. |
 | <span class="prop-name">message</span> | <span class="prop-type">node |   | The message to display. |
@@ -60,7 +60,7 @@ This property accepts the following keys:
 | <span class="prop-name">anchorOriginTopLeft</span> | Styles applied to the root element if `anchorOrigin={{ 'top', 'left' }}`.
 | <span class="prop-name">anchorOriginBottomLeft</span> | Styles applied to the root element if `anchorOrigin={{ 'bottom', 'left' }}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Snackbar/Snackbar.js)
 for more detail.
 
diff --git a/pages/api/step-button.md b/pages/api/step-button.md
index 1404b89d21997e..a565ebb25ba072 100644
--- a/pages/api/step-button.md
+++ b/pages/api/step-button.md
@@ -39,7 +39,7 @@ This property accepts the following keys:
 | <span class="prop-name">vertical</span> | Styles applied to the root element if `orientation="vertical"`.
 | <span class="prop-name">touchRipple</span> | Styles applied to the `ButtonBase` touch-ripple.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/StepButton/StepButton.js)
 for more detail.
 
@@ -49,7 +49,7 @@ you need to use the following style sheet name: `MuiStepButton`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/step-connector.md b/pages/api/step-connector.md
index 74630558817839..33eeaf78186d87 100644
--- a/pages/api/step-connector.md
+++ b/pages/api/step-connector.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">lineHorizontal</span> | Styles applied to the root element if `orientation="horizontal"`.
 | <span class="prop-name">lineVertical</span> | Styles applied to the root element if `orientation="vertical"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/StepConnector/StepConnector.js)
 for more detail.
 
diff --git a/pages/api/step-content.md b/pages/api/step-content.md
index 332ae3d1a1891f..c24331a9f28da3 100644
--- a/pages/api/step-content.md
+++ b/pages/api/step-content.md
@@ -39,7 +39,7 @@ This property accepts the following keys:
 | <span class="prop-name">last</span> | Styles applied to the root element if `last={true}` (controlled by `Step`).
 | <span class="prop-name">transition</span> | Styles applied to the Transition component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/StepContent/StepContent.js)
 for more detail.
 
diff --git a/pages/api/step-icon.md b/pages/api/step-icon.md
index 526e318360a063..c2c674c61e7e99 100644
--- a/pages/api/step-icon.md
+++ b/pages/api/step-icon.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">completed</span> | Styles applied to the root element if `completed={true}`.
 | <span class="prop-name">error</span> | Styles applied to the root element if `error={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/StepIcon/StepIcon.js)
 for more detail.
 
diff --git a/pages/api/step-label.md b/pages/api/step-label.md
index 87eb0bfc4c94a2..6d73d145b96555 100644
--- a/pages/api/step-label.md
+++ b/pages/api/step-label.md
@@ -25,8 +25,8 @@ import StepLabel from '@material-ui/core/StepLabel';
 | <span class="prop-name">error</span> | <span class="prop-type">bool | <span class="prop-default">false</span> | Mark the step as failed. |
 | <span class="prop-name">icon</span> | <span class="prop-type">node |   | Override the default icon. |
 | <span class="prop-name">optional</span> | <span class="prop-type">node |   | The optional node to display. |
-| <span class="prop-name">StepIconComponent</span> | <span class="prop-type">union:&nbsp;string&nbsp;&#124;<br>&nbsp;func&nbsp;&#124;<br>&nbsp;object<br> |   | The component to render in place of the [`StepIcon`](/api/step-icon). |
-| <span class="prop-name">StepIconProps</span> | <span class="prop-type">object |   | Properties applied to the [`StepIcon`](/api/step-icon) element. |
+| <span class="prop-name">StepIconComponent</span> | <span class="prop-type">union:&nbsp;string&nbsp;&#124;<br>&nbsp;func&nbsp;&#124;<br>&nbsp;object<br> |   | The component to render in place of the [`StepIcon`](/api/step-icon/). |
+| <span class="prop-name">StepIconProps</span> | <span class="prop-type">object |   | Properties applied to the [`StepIcon`](/api/step-icon/) element. |
 
 Any other properties supplied will be spread to the root element (native element).
 
@@ -50,7 +50,7 @@ This property accepts the following keys:
 | <span class="prop-name">alternativeLabel</span> | Styles applied to the root & icon container and `Typography` if `alternativeLabel={true}`.
 | <span class="prop-name">labelContainer</span> | Styles applied to the container element which wraps `Typography` and `optional`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/StepLabel/StepLabel.js)
 for more detail.
 
diff --git a/pages/api/step.md b/pages/api/step.md
index c8fec1d864e49d..ccf010e799eaa6 100644
--- a/pages/api/step.md
+++ b/pages/api/step.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">alternativeLabel</span> | Styles applied to the root element if `alternativeLabel={true}`.
 | <span class="prop-name">completed</span> | Styles applied to the root element if `completed={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Step/Step.js)
 for more detail.
 
diff --git a/pages/api/stepper.md b/pages/api/stepper.md
index b024fe06056cc2..8990232a4ffbe2 100644
--- a/pages/api/stepper.md
+++ b/pages/api/stepper.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">vertical</span> | Styles applied to the root element if `orientation="vertical"`.
 | <span class="prop-name">alternativeLabel</span> | Styles applied to the root element if `alternativeLabel={true}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Stepper/Stepper.js)
 for more detail.
 
@@ -52,7 +52,7 @@ you need to use the following style sheet name: `MuiStepper`.
 
 ## Inheritance
 
-The properties of the [Paper](/api/paper) component are also available.
+The properties of the [Paper](/api/paper/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/svg-icon.md b/pages/api/svg-icon.md
index d9cfcccf770fb9..4c25008bd4ed03 100644
--- a/pages/api/svg-icon.md
+++ b/pages/api/svg-icon.md
@@ -48,7 +48,7 @@ This property accepts the following keys:
 | <span class="prop-name">fontSizeSmall</span> | Styles applied to the root element if `fontSize="small"`.
 | <span class="prop-name">fontSizeLarge</span> | Styles applied to the root element if `fontSize="large"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/SvgIcon/SvgIcon.js)
 for more detail.
 
diff --git a/pages/api/swipeable-drawer.md b/pages/api/swipeable-drawer.md
index b8ab48efb9241f..5a10a7a8597f28 100644
--- a/pages/api/swipeable-drawer.md
+++ b/pages/api/swipeable-drawer.md
@@ -34,7 +34,7 @@ Any other properties supplied will be spread to the root element ([Drawer](/api/
 
 ## Inheritance
 
-The properties of the [Drawer](/api/drawer) component are also available.
+The properties of the [Drawer](/api/drawer/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/switch.md b/pages/api/switch.md
index 5be78d0132f24b..ab99ddf8bc544a 100644
--- a/pages/api/switch.md
+++ b/pages/api/switch.md
@@ -53,7 +53,7 @@ This property accepts the following keys:
 | <span class="prop-name">disabled</span> | Styles applied to the internal SwitchBase component's disabled class.
 | <span class="prop-name">bar</span> | Styles applied to the bar element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Switch/Switch.js)
 for more detail.
 
diff --git a/pages/api/tab.md b/pages/api/tab.md
index feb886b28a1eb8..21853df6e70e00 100644
--- a/pages/api/tab.md
+++ b/pages/api/tab.md
@@ -49,7 +49,7 @@ This property accepts the following keys:
 | <span class="prop-name">label</span> | Styles applied to the label wrapper element if `label` is provided.
 | <span class="prop-name">labelWrapped</span> | Styles applied to the label wrapper element if `label` is provided and the text is wrapped.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Tab/Tab.js)
 for more detail.
 
@@ -59,7 +59,7 @@ you need to use the following style sheet name: `MuiTab`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/table-body.md b/pages/api/table-body.md
index 5fe39b5a2860c9..02f132c55d5def 100644
--- a/pages/api/table-body.md
+++ b/pages/api/table-body.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableBody/TableBody.js)
 for more detail.
 
diff --git a/pages/api/table-cell.md b/pages/api/table-cell.md
index a4c83b524fe046..fbe7b188b6ec1d 100644
--- a/pages/api/table-cell.md
+++ b/pages/api/table-cell.md
@@ -47,7 +47,7 @@ This property accepts the following keys:
 | <span class="prop-name">paddingCheckbox</span> | Styles applied to the root element if `padding="checkbox"`.
 | <span class="prop-name">paddingNone</span> | Styles applied to the root element if `padding="none"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableCell/TableCell.js)
 for more detail.
 
diff --git a/pages/api/table-footer.md b/pages/api/table-footer.md
index e591dff56e0808..6e5df664f70129 100644
--- a/pages/api/table-footer.md
+++ b/pages/api/table-footer.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableFooter/TableFooter.js)
 for more detail.
 
diff --git a/pages/api/table-head.md b/pages/api/table-head.md
index b3c1b23f405ac1..8e0cbfd7aaeca4 100644
--- a/pages/api/table-head.md
+++ b/pages/api/table-head.md
@@ -35,7 +35,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableHead/TableHead.js)
 for more detail.
 
diff --git a/pages/api/table-pagination.md b/pages/api/table-pagination.md
index cd1e1e39e0a9e5..489af4f2d8511f 100644
--- a/pages/api/table-pagination.md
+++ b/pages/api/table-pagination.md
@@ -55,7 +55,7 @@ This property accepts the following keys:
 | <span class="prop-name">menuItem</span> | Styles applied to the MenuItem component.
 | <span class="prop-name">actions</span> | Styles applied to the internal `TablePaginationActions` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TablePagination/TablePagination.js)
 for more detail.
 
@@ -65,7 +65,7 @@ you need to use the following style sheet name: `MuiTablePagination`.
 
 ## Inheritance
 
-The properties of the [TableCell](/api/table-cell) component are also available.
+The properties of the [TableCell](/api/table-cell/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/table-row.md b/pages/api/table-row.md
index fdc54af55f21cc..8a563dc5b6ac25 100644
--- a/pages/api/table-row.md
+++ b/pages/api/table-row.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">head</span> | Styles applied to the root element if table variant = 'head'.
 | <span class="prop-name">footer</span> | Styles applied to the root element if table variant = 'footer'.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableRow/TableRow.js)
 for more detail.
 
diff --git a/pages/api/table-sort-label.md b/pages/api/table-sort-label.md
index 3042d48d98c266..db7f3d9e5a33d2 100644
--- a/pages/api/table-sort-label.md
+++ b/pages/api/table-sort-label.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">iconDirectionDesc</span> | Styles applied to the icon component if `direction="desc"`.
 | <span class="prop-name">iconDirectionAsc</span> | Styles applied to the icon component if `direction="asc"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/TableSortLabel/TableSortLabel.js)
 for more detail.
 
@@ -52,7 +52,7 @@ you need to use the following style sheet name: `MuiTableSortLabel`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/table.md b/pages/api/table.md
index 271dbee869c109..889d5b399cd516 100644
--- a/pages/api/table.md
+++ b/pages/api/table.md
@@ -36,7 +36,7 @@ This property accepts the following keys:
 |:-----|:------------|
 | <span class="prop-name">root</span> | Styles applied to the root element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Table/Table.js)
 for more detail.
 
diff --git a/pages/api/tabs.md b/pages/api/tabs.md
index d28cca92873fb2..cdcf0f82c6200f 100644
--- a/pages/api/tabs.md
+++ b/pages/api/tabs.md
@@ -54,7 +54,7 @@ This property accepts the following keys:
 | <span class="prop-name">scrollButtonsAuto</span> | Styles applied to the `ScrollButtonComponent` component if `scrollButtons="auto"`.
 | <span class="prop-name">indicator</span> | Styles applied to the `TabIndicator` component.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Tabs/Tabs.js)
 for more detail.
 
diff --git a/pages/api/text-field.md b/pages/api/text-field.md
index e22a628f1de5b6..15d9740428fe8a 100644
--- a/pages/api/text-field.md
+++ b/pages/api/text-field.md
@@ -76,7 +76,7 @@ Any other properties supplied will be spread to the root element ([FormControl](
 
 ## Inheritance
 
-The properties of the [FormControl](/api/form-control) component are also available.
+The properties of the [FormControl](/api/form-control/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos
diff --git a/pages/api/toolbar.md b/pages/api/toolbar.md
index 990863418493a0..d322da86f441fd 100644
--- a/pages/api/toolbar.md
+++ b/pages/api/toolbar.md
@@ -39,7 +39,7 @@ This property accepts the following keys:
 | <span class="prop-name">regular</span> | Styles applied to the root element if `variant="regular"`.
 | <span class="prop-name">dense</span> | Styles applied to the root element if `variant="dense"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Toolbar/Toolbar.js)
 for more detail.
 
diff --git a/pages/api/tooltip.md b/pages/api/tooltip.md
index f729d68d0386e7..b7c99fcee625e9 100644
--- a/pages/api/tooltip.md
+++ b/pages/api/tooltip.md
@@ -56,7 +56,7 @@ This property accepts the following keys:
 | <span class="prop-name">tooltipPlacementTop</span> | Styles applied to the tooltip (label wrapper) element if `placement` contains "top".
 | <span class="prop-name">tooltipPlacementBottom</span> | Styles applied to the tooltip (label wrapper) element if `placement` contains "bottom".
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Tooltip/Tooltip.js)
 for more detail.
 
diff --git a/pages/api/touch-ripple.md b/pages/api/touch-ripple.md
index 477681b6dfbfff..66b834bfdedbcc 100644
--- a/pages/api/touch-ripple.md
+++ b/pages/api/touch-ripple.md
@@ -40,7 +40,7 @@ This property accepts the following keys:
 | <span class="prop-name">childLeaving</span> | Styles applied to the internal `Ripple` components `childLeaving` class.
 | <span class="prop-name">childPulsate</span> | Styles applied to the internal `Ripple` components `childPulsate` class.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/ButtonBase/TouchRipple.js)
 for more detail.
 
diff --git a/pages/api/typography.md b/pages/api/typography.md
index b27700b48866ac..200b27ff33a59a 100644
--- a/pages/api/typography.md
+++ b/pages/api/typography.md
@@ -67,7 +67,7 @@ This property accepts the following keys:
 | <span class="prop-name">colorTextSecondary</span> | Styles applied to the root element if `color="textSecondary"`.
 | <span class="prop-name">colorError</span> | Styles applied to the root element if `color="error"`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui/src/Typography/Typography.js)
 for more detail.
 
diff --git a/pages/lab/api/slider.md b/pages/lab/api/slider.md
index fa62c85a74c64f..6a4834e1867c28 100644
--- a/pages/lab/api/slider.md
+++ b/pages/lab/api/slider.md
@@ -56,7 +56,7 @@ This property accepts the following keys:
 | <span class="prop-name">activated</span> | Class applied to the track and thumb elements to trigger JSS nested styles if `activated`.
 | <span class="prop-name">vertical</span> | Class applied to the root, track and container to trigger JSS nested styles if `vertical`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/Slider/Slider.js)
 for more detail.
 
diff --git a/pages/lab/api/speed-dial-action.md b/pages/lab/api/speed-dial-action.md
index 83837d5aede4df..69c3970383a90d 100644
--- a/pages/lab/api/speed-dial-action.md
+++ b/pages/lab/api/speed-dial-action.md
@@ -41,7 +41,7 @@ This property accepts the following keys:
 | <span class="prop-name">button</span> | Styles applied to the `Button` component.
 | <span class="prop-name">buttonClosed</span> | Styles applied to the `Button` component if `open={false}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/SpeedDialAction/SpeedDialAction.js)
 for more detail.
 
diff --git a/pages/lab/api/speed-dial-icon.md b/pages/lab/api/speed-dial-icon.md
index 9d5f79fbe13949..49c5c639b9ba09 100644
--- a/pages/lab/api/speed-dial-icon.md
+++ b/pages/lab/api/speed-dial-icon.md
@@ -40,7 +40,7 @@ This property accepts the following keys:
 | <span class="prop-name">openIcon</span> | Styles applied to the `openIcon` if provided.
 | <span class="prop-name">openIconOpen</span> | Styles applied to the `openIcon` if provided & if `open={true}`
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/SpeedDialIcon/SpeedDialIcon.js)
 for more detail.
 
diff --git a/pages/lab/api/speed-dial.md b/pages/lab/api/speed-dial.md
index 612859b6217c58..1c77b102e7b7a9 100644
--- a/pages/lab/api/speed-dial.md
+++ b/pages/lab/api/speed-dial.md
@@ -52,7 +52,7 @@ This property accepts the following keys:
 | <span class="prop-name">actions</span> | Styles applied to the actions (`children` wrapper) element.
 | <span class="prop-name">actionsClosed</span> | Styles applied to the actions (`children` wrapper) element if `open={false}`.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/SpeedDial/SpeedDial.js)
 for more detail.
 
diff --git a/pages/lab/api/toggle-button-group.md b/pages/lab/api/toggle-button-group.md
index 1123784004026b..3d74618223fed0 100644
--- a/pages/lab/api/toggle-button-group.md
+++ b/pages/lab/api/toggle-button-group.md
@@ -39,7 +39,7 @@ This property accepts the following keys:
 | <span class="prop-name">root</span> | Styles applied to the root element.
 | <span class="prop-name">selected</span> | Styles applied to the root element if `selected={true}` or `selected="auto" and `value` set.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/ToggleButtonGroup/ToggleButtonGroup.js)
 for more detail.
 
diff --git a/pages/lab/api/toggle-button.md b/pages/lab/api/toggle-button.md
index f6ce46f9a75ccf..bd52d1ce0bb10a 100644
--- a/pages/lab/api/toggle-button.md
+++ b/pages/lab/api/toggle-button.md
@@ -42,7 +42,7 @@ This property accepts the following keys:
 | <span class="prop-name">selected</span> | Styles applied to the root element if `selected={true}`.
 | <span class="prop-name">label</span> | Styles applied to the `label` wrapper element.
 
-Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section
+Have a look at [overriding with classes](/customization/overrides/#overriding-with-classes) section
 and the [implementation of the component](https://github.com/mui-org/material-ui/tree/master/packages/material-ui-lab/src/ToggleButton/ToggleButton.js)
 for more detail.
 
@@ -52,7 +52,7 @@ you need to use the following style sheet name: `MuiToggleButton`.
 
 ## Inheritance
 
-The properties of the [ButtonBase](/api/button-base) component are also available.
+The properties of the [ButtonBase](/api/button-base/) component are also available.
 You can take advantage of this behavior to [target nested components](/guides/api/#spread).
 
 ## Demos