diff --git a/lib/codeviewer/code_segments.dart b/lib/codeviewer/code_segments.dart
index 76e1f892c7..a8dd2a460c 100644
--- a/lib/codeviewer/code_segments.dart
+++ b/lib/codeviewer/code_segments.dart
@@ -25420,6 +25420,458 @@ class CodeSegments {
     ]);
   }
 
+  static TextSpan navRailDemo(BuildContext context) {
+    final codeStyle = CodeStyle.of(context);
+    return TextSpan(children: [
+      TextSpan(
+          style: codeStyle.commentStyle,
+          text: '// Copyright 2019 The Flutter team. All rights reserved.'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a'),
+      TextSpan(
+          style: codeStyle.commentStyle,
+          text:
+              '// Use of this source code is governed by a BSD-style license that can be'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a'),
+      TextSpan(
+          style: codeStyle.commentStyle, text: '// found in the LICENSE file.'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a'),
+      TextSpan(style: codeStyle.keywordStyle, text: 'import'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(
+          style: codeStyle.stringStyle,
+          text: '\u0027package:flutter/material.dart\u0027'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a'),
+      TextSpan(style: codeStyle.keywordStyle, text: 'import'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(
+          style: codeStyle.stringStyle,
+          text:
+              '\u0027package:flutter_gen/gen_l10n/gallery_localizations.dart\u0027'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a'),
+      TextSpan(style: codeStyle.keywordStyle, text: 'class'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavRailDemo'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'extends'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'StatefulWidget'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a  '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavRailDemo'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '({'),
+      TextSpan(style: codeStyle.classStyle, text: 'Key'),
+      TextSpan(style: codeStyle.baseStyle, text: ' key'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '})'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'super'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: 'key'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' key'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ');'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a  '),
+      TextSpan(style: codeStyle.keywordStyle, text: '@override'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a  '),
+      TextSpan(style: codeStyle.classStyle, text: '_NavRailDemoState'),
+      TextSpan(style: codeStyle.baseStyle, text: ' createState'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '()'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '=>'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: '_NavRailDemoState'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '();'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '}'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a'),
+      TextSpan(style: codeStyle.keywordStyle, text: 'class'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: '_NavRailDemoState'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'extends'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'State'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '<'),
+      TextSpan(style: codeStyle.classStyle, text: 'NavRailDemo'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '>'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a  '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'int'),
+      TextSpan(style: codeStyle.baseStyle, text: ' _selectedIndex '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.numberStyle, text: '0'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a  '),
+      TextSpan(style: codeStyle.keywordStyle, text: '@override'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Widget'),
+      TextSpan(style: codeStyle.baseStyle, text: ' build'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.classStyle, text: 'BuildContext'),
+      TextSpan(style: codeStyle.baseStyle, text: ' context'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ')'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'final'),
+      TextSpan(style: codeStyle.baseStyle, text: ' localization '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'GalleryLocalizations'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'of'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: 'context'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ');'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'final'),
+      TextSpan(style: codeStyle.baseStyle, text: ' destinationFirst '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' localization'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'demoNavigationRailFirst'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'final'),
+      TextSpan(style: codeStyle.baseStyle, text: ' destinationSecond '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' localization'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'demoNavigationRailSecond'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'final'),
+      TextSpan(style: codeStyle.baseStyle, text: ' destinationThird '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' localization'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'demoNavigationRailThird'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'final'),
+      TextSpan(style: codeStyle.baseStyle, text: ' selectedItem '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '<'),
+      TextSpan(style: codeStyle.classStyle, text: 'String'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '>['),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a      destinationFirst'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a      destinationSecond'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a      destinationThird\u000a    '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '];'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'return'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Scaffold'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a      appBar'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'AppBar'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a        title'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Text'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a          localization'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'demoNavigationRailTitle'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a        '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a      '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a      body'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Row'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a        children'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '['),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a          '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavigationRail'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            leading'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'FloatingActionButton'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              child'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'add'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a              onPressed'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '()'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{},'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a            selectedIndex'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' _selectedIndex'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a            onDestinationSelected'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: 'index'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ')'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{'),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a              setState'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '(()'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '{'),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                _selectedIndex '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '='),
+      TextSpan(style: codeStyle.baseStyle, text: ' index'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ';'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '});'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '},'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            labelType'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavigationRailLabelType'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'selected'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(
+          style: codeStyle.baseStyle, text: '\u000a            destinations'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '['),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavigationRailDestination'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'favorite_border'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                selectedIcon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'favorite'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                label'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Text'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                  destinationFirst'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavigationRailDestination'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'bookmark_border'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                selectedIcon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'book'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                label'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Text'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                  destinationSecond'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.classStyle, text: 'NavigationRailDestination'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'star_border'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                selectedIcon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icon'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                  '),
+      TextSpan(style: codeStyle.classStyle, text: 'Icons'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '.'),
+      TextSpan(style: codeStyle.baseStyle, text: 'star'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                label'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Text'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                  destinationThird'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a                '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '],'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a          '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a          '),
+      TextSpan(style: codeStyle.keywordStyle, text: 'const'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'VerticalDivider'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: 'thickness'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.numberStyle, text: '1'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ','),
+      TextSpan(style: codeStyle.baseStyle, text: ' width'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.numberStyle, text: '1'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a          '),
+      TextSpan(style: codeStyle.classStyle, text: 'Expanded'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            child'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Center'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              child'),
+      TextSpan(style: codeStyle.punctuationStyle, text: ':'),
+      TextSpan(style: codeStyle.baseStyle, text: ' '),
+      TextSpan(style: codeStyle.classStyle, text: 'Text'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '('),
+      TextSpan(
+          style: codeStyle.baseStyle,
+          text: '\u000a                selectedItem'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '['),
+      TextSpan(style: codeStyle.baseStyle, text: '_selectedIndex'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '],'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a              '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a            '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a          '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a        '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '],'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a      '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '),'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a    '),
+      TextSpan(style: codeStyle.punctuationStyle, text: ');'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a  '),
+      TextSpan(style: codeStyle.punctuationStyle, text: '}'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a'),
+      TextSpan(style: codeStyle.punctuationStyle, text: '}'),
+      TextSpan(style: codeStyle.baseStyle, text: '\u000a\u000a'),
+    ]);
+  }
+
   static TextSpan openContainerTransformDemo(BuildContext context) {
     final codeStyle = CodeStyle.of(context);
     return TextSpan(children: [
diff --git a/lib/data/demos.dart b/lib/data/demos.dart
index d7889beb43..6470c47fa0 100644
--- a/lib/data/demos.dart
+++ b/lib/data/demos.dart
@@ -35,6 +35,7 @@ import 'package:gallery/demos/material/grid_list_demo.dart';
 import 'package:gallery/demos/material/list_demo.dart';
 import 'package:gallery/demos/material/menu_demo.dart';
 import 'package:gallery/demos/material/navigation_drawer.dart';
+import 'package:gallery/demos/material/navigation_rail_demo.dart';
 import 'package:gallery/demos/material/picker_demo.dart';
 import 'package:gallery/demos/material/progress_indicator_demo.dart';
 import 'package:gallery/demos/material/selection_controls_demo.dart';
@@ -538,6 +539,22 @@ List<GalleryDemo> materialDemos(GalleryLocalizations localizations) {
       ],
       category: GalleryDemoCategory.material,
     ),
+    GalleryDemo(
+      title: localizations.demoNavigationRailTitle,
+      icon: GalleryIcons.navigationRail,
+      slug: 'nav_rail',
+      subtitle: localizations.demoNavigationRailSubtitle,
+      configurations: [
+        GalleryDemoConfiguration(
+          title: localizations.demoNavigationRailTitle,
+          description: localizations.demoNavigationRailDescription,
+          documentationUrl: '$_docsBaseUrl/material/NavigationRail-class.html',
+          buildRoute: (_) => const NavRailDemo(),
+          code: CodeSegments.navRailDemo,
+        ),
+      ],
+      category: GalleryDemoCategory.material,
+    ),
     GalleryDemo(
       title: localizations.demoPickersTitle,
       icon: GalleryIcons.event,
diff --git a/lib/data/icons.dart b/lib/data/icons.dart
index 984ca23caa..8d6f8bf9c4 100644
--- a/lib/data/icons.dart
+++ b/lib/data/icons.dart
@@ -167,4 +167,8 @@ class GalleryIcons {
     0xe927,
     fontFamily: 'GalleryIcons',
   );
+  static const IconData navigationRail = IconData(
+    60080,
+    fontFamily: 'MaterialIcons',
+  );
 }
diff --git a/lib/demos/material/navigation_rail_demo.dart b/lib/demos/material/navigation_rail_demo.dart
new file mode 100644
index 0000000000..96e6f611dd
--- /dev/null
+++ b/lib/demos/material/navigation_rail_demo.dart
@@ -0,0 +1,101 @@
+// Copyright 2019 The Flutter team. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'package:flutter/material.dart';
+import 'package:flutter_gen/gen_l10n/gallery_localizations.dart';
+
+// BEGIN navRailDemo
+
+class NavRailDemo extends StatefulWidget {
+  const NavRailDemo({Key key}) : super(key: key);
+
+  @override
+  _NavRailDemoState createState() => _NavRailDemoState();
+}
+
+class _NavRailDemoState extends State<NavRailDemo> {
+  int _selectedIndex = 0;
+
+  @override
+  Widget build(BuildContext context) {
+    final localization = GalleryLocalizations.of(context);
+    final destinationFirst = localization.demoNavigationRailFirst;
+    final destinationSecond = localization.demoNavigationRailSecond;
+    final destinationThird = localization.demoNavigationRailThird;
+    final selectedItem = <String>[
+      destinationFirst,
+      destinationSecond,
+      destinationThird
+    ];
+    return Scaffold(
+      appBar: AppBar(
+        title: Text(
+          localization.demoNavigationRailTitle,
+        ),
+      ),
+      body: Row(
+        children: [
+          NavigationRail(
+            leading: FloatingActionButton(
+              child: const Icon(Icons.add),
+              onPressed: () {},
+            ),
+            selectedIndex: _selectedIndex,
+            onDestinationSelected: (index) {
+              setState(() {
+                _selectedIndex = index;
+              });
+            },
+            labelType: NavigationRailLabelType.selected,
+            destinations: [
+              NavigationRailDestination(
+                icon: const Icon(
+                  Icons.favorite_border,
+                ),
+                selectedIcon: const Icon(
+                  Icons.favorite,
+                ),
+                label: Text(
+                  destinationFirst,
+                ),
+              ),
+              NavigationRailDestination(
+                icon: const Icon(
+                  Icons.bookmark_border,
+                ),
+                selectedIcon: const Icon(
+                  Icons.book,
+                ),
+                label: Text(
+                  destinationSecond,
+                ),
+              ),
+              NavigationRailDestination(
+                icon: const Icon(
+                  Icons.star_border,
+                ),
+                selectedIcon: const Icon(
+                  Icons.star,
+                ),
+                label: Text(
+                  destinationThird,
+                ),
+              ),
+            ],
+          ),
+          const VerticalDivider(thickness: 1, width: 1),
+          Expanded(
+            child: Center(
+              child: Text(
+                selectedItem[_selectedIndex],
+              ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+// END
diff --git a/lib/l10n/intl_en.arb b/lib/l10n/intl_en.arb
index a8a9449301..895a86b5f4 100644
--- a/lib/l10n/intl_en.arb
+++ b/lib/l10n/intl_en.arb
@@ -1113,6 +1113,30 @@
   "@demoNavigationDrawerText": {
     "description": "Description to open navigation drawer."
   },
+  "demoNavigationRailTitle": "Navigation Rail",
+  "@demoNavigationRailTitle": {
+    "description": "Title for the material Navigation Rail component demo."
+  },
+  "demoNavigationRailSubtitle": "Displaying a Navigation Rail within an app",
+  "@demoNavigationRailSubtitle": {
+    "description": "Subtitle for the material Navigation Rail component demo."
+  },
+  "demoNavigationRailDescription": "A material widget that is meant to be displayed at the left or right of an app to navigate between a small number of views, typically between three and five.",
+  "@demoNavigationRailDescription": {
+    "description": "Description for the material Navigation Rail component demo."
+  },
+  "demoNavigationRailFirst": "First",
+  "@demoNavigationRailFirst": {
+    "description": "Navigation Rail destination first label."
+  },
+  "demoNavigationRailSecond": "Second",
+  "@demoNavigationRailSecond": {
+    "description": "Navigation Rail destination second label."
+  },
+  "demoNavigationRailThird": "Third",
+  "@demoNavigationRailThird": {
+    "description": "Navigation Rail destination Third label."
+  },
   "demoMenuAnItemWithASimpleMenu": "An item with a simple menu",
   "@demoMenuAnItemWithASimpleMenu": {
     "description": "Label next to a button that opens a simple menu. A menu displays a list of choices on a temporary surface. Used as an example in a demo."
diff --git a/lib/l10n/intl_en_US.xml b/lib/l10n/intl_en_US.xml
index 769dae2175..73fabca122 100644
--- a/lib/l10n/intl_en_US.xml
+++ b/lib/l10n/intl_en_US.xml
@@ -1013,6 +1013,30 @@
     name="demoNavigationDrawerText"
     description="Description to open navigation drawer."
     >Swipe from the edge or tap the upper-left icon to see the drawer</string>
+  <string
+    name="demoNavigationRailTitle"
+    description="Title for the material Navigation Rail component demo."
+    >Navigation Rail</string>
+  <string
+    name="demoNavigationRailSubtitle"
+    description="Subtitle for the material Navigation Rail component demo."
+    >Displaying a Navigation Rail within an app</string>
+  <string
+    name="demoNavigationRailDescription"
+    description="Description for the material Navigation Rail component demo."
+    >A material widget that is meant to be displayed at the left or right of an app to navigate between a small number of views, typically between three and five.</string>
+  <string
+    name="demoNavigationRailFirst"
+    description="Navigation Rail destination first label."
+    >First</string>
+  <string
+    name="demoNavigationRailSecond"
+    description="Navigation Rail destination second label."
+    >Second</string>
+  <string
+    name="demoNavigationRailThird"
+    description="Navigation Rail destination Third label."
+    >Third</string>
   <string
     name="demoMenuAnItemWithASimpleMenu"
     description="Label next to a button that opens a simple menu. A menu displays a list of choices on a temporary surface. Used as an example in a demo."