Repository: microsoft/terminal (language: cpp)

Issue:
People think the Color Scheme editor will change the current colors
### Windows Terminal version (or Windows build number)

10.0.21354 (Dev)

### Other Software

_No response_

### Steps to reproduce

1. Launch Terminal
2. Open Settings
3. Color Schemes
4. Select another color scheme from combo
5. Click to Save
6. Reopen Settings -> Color Scheme didn't applied

### Expected Behavior

_No response_

### Actual Behavior

Color Scheme.


Discussion / hints:
What terminal version.
I'm seeing this issue as well. Just updated to v1.7.1033.0 (the new release). No matter what I try, I can't seem to apply a color scheme using the new Settings UI. It gets reset back to Campbell on each relaunch.

Edit: This issue with with the default color scheme. Changing the scheme under individual profiles does apply the scheme properly to that profile.

Edit 2: Looking at recent commits, looks like it might be fixed in #9764 
Same issue. Version: 1.7.1033.0
Edit: Also would be nice to be able to get to settings json file with keyboard shortcut (as before graphical UI ctr ,) because graphical UI doesn't have all the options settings json has. thanks!
Wait HOLD UP.

Are you going to the "Color Schemes" page
![image](https://user-images.githubusercontent.com/18356694/115410049-eea7e600-a1b7-11eb-825c-c12ca8a3535c.png)

or are you changing the "color scheme" of a given profile:
![image](https://user-images.githubusercontent.com/18356694/115410168-05e6d380-a1b8-11eb-8a19-45f7acf4c6d1.png)


The first page is used for _editing the color scheme itself_. The second is for changing the appearance of the selected profile. The dropdown on the Color Schemes page is just used for _selecting which scheme you want to edit_. It doesn't apply that scheme to any profiles.

@zadjii-msft You're totally correct, now that I've taken a look into that. Gotta say though, it's definitely confusing on first use. I would assume that the Color schemes page is for selecting a default color scheme for all profiles (and yes you could edit the colors as well). Then you can go into individual profiles and override to a different color scheme.

Perhaps it just needs some some clarification on what the Coloring schemes page does. Maybe selecting a default color scheme would be better suited under Appearance (if setting a default color scheme is a goal).
Is it possible to change default theme that would apply to all profiles like via settings.json?
> Is it possible to change default theme that would apply to all profiles like via settings.json?

/cc @cinnamon-msft 
I'll make sure to pass that feedback along to the UI designers (and my "I" I mean @cinnamon-msft 😋)

I'll close the rest of this discussion about setting the default for all profiles as a /duplicate of #9539 - we're generally having that discussion in that thread.
Hi! We've identified this issue as a duplicate of another one that already exists on this Issue Tracker. This specific instance is being closed in favor of tracking the concern over on the referenced thread. Thanks for your report!
We're reopening this, because it's come up a bunch of times now. The design clearly needs some improvement in this regard.

TODO:
* [ ] Do a competitive analysis, see what other terminals do for this UX. Clearly, we're doing something misleading

Ideas:

* Just get rid of the scheme editor entirely, replace it with a ContentDialog in the Profiles>Appearances page
* Maybe we should add a button to the color schemes page that says something like "Apply this scheme to all profiles". 
* Alternatively, we could add some help text to the top/bottom like "Trying to change the color scheme for a particular profile? Go change '[Profile > Appearance > Color scheme](in-app link to default appearances)'"


There were other suggestions too, just logging before 5pm.

Fix patch:
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.cpp b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.cpp
index f111879f636..62491f7418d 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.cpp
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.cpp
@@ -10,10 +10,12 @@
 
 namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
 {
-    ColorSchemeViewModel::ColorSchemeViewModel(const Model::ColorScheme scheme) :
+    ColorSchemeViewModel::ColorSchemeViewModel(const Model::ColorScheme scheme, const Editor::ColorSchemesPageViewModel parentPageVM, const Model::CascadiaSettings& settings) :
         _scheme{ scheme },
+        _settings{ settings },
         _NonBrightColorTable{ single_threaded_observable_vector<Editor::ColorTableEntry>() },
-        _BrightColorTable{ single_threaded_observable_vector<Editor::ColorTableEntry>() }
+        _BrightColorTable{ single_threaded_observable_vector<Editor::ColorTableEntry>() },
+        _parentPageVM{ parentPageVM }
     {
         _Name = scheme.Name();
 
@@ -48,6 +50,25 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         return _Name;
     }
 
+    bool ColorSchemeViewModel::IsDefaultScheme()
+    {
+        return _Name == _settings.ProfileDefaults().DefaultAppearance().ColorSchemeName();
+    }
+
+    void ColorSchemeViewModel::RefreshIsDefault()
+    {
+        _NotifyChanges(L"IsDefaultScheme");
+    }
+
+    bool ColorSchemeViewModel::RequestRename(winrt::hstring newName)
+    {
+        if (const auto parentPageVM{ _parentPageVM.get() })
+        {
+            return parentPageVM.RequestRenameCurrentScheme(newName);
+        }
+        return false;
+    }
+
     void ColorSchemeViewModel::Name(winrt::hstring newName)
     {
         _scheme.Name(newName);
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.h b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.h
index 9b99ac7d2be..84158100c3e 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.h
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.h
@@ -21,16 +21,25 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
     struct ColorSchemeViewModel : ColorSchemeViewModelT<ColorSchemeViewModel>, ViewModelHelper<ColorSchemeViewModel>
     {
     public:
-        ColorSchemeViewModel(const Model::ColorScheme scheme);
+        ColorSchemeViewModel(const Model::ColorScheme scheme, const Editor::ColorSchemesPageViewModel parentPageVM, const Model::CascadiaSettings& settings);
 
         winrt::hstring Name();
         void Name(winrt::hstring newName);
+        hstring ToString()
+        {
+            return Name();
+        }
+
+        bool RequestRename(winrt::hstring newName);
 
         Editor::ColorTableEntry ColorEntryAt(uint32_t index);
+        bool IsDefaultScheme();
+        void RefreshIsDefault();
 
         // DON'T YOU DARE ADD A `WINRT_CALLBACK(PropertyChanged` TO A CLASS DERIVED FROM ViewModelHelper. Do this instead:
         using ViewModelHelper<ColorSchemeViewModel>::PropertyChanged;
 
+        WINRT_PROPERTY(bool, IsInBoxScheme);
         WINRT_PROPERTY(Windows::Foundation::Collections::IVector<Editor::ColorTableEntry>, NonBrightColorTable, nullptr);
         WINRT_PROPERTY(Windows::Foundation::Collections::IVector<Editor::ColorTableEntry>, BrightColorTable, nullptr);
 
@@ -42,6 +51,8 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
     private:
         winrt::hstring _Name;
         Model::ColorScheme _scheme;
+        Model::CascadiaSettings _settings;
+        weak_ref<Editor::ColorSchemesPageViewModel> _parentPageVM{ nullptr };
 
         void _ColorEntryChangedHandler(const Windows::Foundation::IInspectable& sender, const Windows::UI::Xaml::Data::PropertyChangedEventArgs& args);
     };
@@ -61,8 +72,3 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         Windows::UI::Color _color;
     };
 };
-
-namespace winrt::Microsoft::Terminal::Settings::Editor::factory_implementation
-{
-    BASIC_FACTORY(ColorSchemeViewModel);
-}
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.idl b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.idl
index c844bd5e134..8ffa62bbaf7 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.idl
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemeViewModel.idl
@@ -5,11 +5,13 @@ import "ColorSchemes.idl";
 
 namespace Microsoft.Terminal.Settings.Editor
 {
-    runtimeclass ColorSchemeViewModel : Windows.UI.Xaml.Data.INotifyPropertyChanged
+    runtimeclass ColorSchemeViewModel : Windows.UI.Xaml.Data.INotifyPropertyChanged, Windows.Foundation.IStringable
     {
-        ColorSchemeViewModel(Microsoft.Terminal.Settings.Model.ColorScheme scheme);
-
         String Name;
+        Boolean IsInBoxScheme;
+        Boolean IsDefaultScheme { get; };
+
+        Boolean RequestRename(String newName);
 
         // Terminal Colors
         Windows.Foundation.Collections.IVector<ColorTableEntry> NonBrightColorTable;
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemes.cpp b/src/cascadia/TerminalSettingsEditor/ColorSchemes.cpp
index 5356a5bdc24..06a84e2e53b 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemes.cpp
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemes.cpp
@@ -30,25 +30,15 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
     {
         InitializeComponent();
 
-        Automation::AutomationProperties::SetName(ColorSchemeComboBox(), RS_(L"ColorScheme_Name/Header"));
-        Automation::AutomationProperties::SetFullDescription(ColorSchemeComboBox(), RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
-        ToolTipService::SetToolTip(ColorSchemeComboBox(), box_value(RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip")));
-
-        Automation::AutomationProperties::SetName(RenameButton(), RS_(L"Rename/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
-
-        Automation::AutomationProperties::SetName(NameBox(), RS_(L"ColorScheme_Name/Header"));
-        Automation::AutomationProperties::SetFullDescription(NameBox(), RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
-        ToolTipService::SetToolTip(NameBox(), box_value(RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip")));
-
-        Automation::AutomationProperties::SetName(RenameAcceptButton(), RS_(L"RenameAccept/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
-        Automation::AutomationProperties::SetName(RenameCancelButton(), RS_(L"RenameCancel/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
+        Automation::AutomationProperties::SetName(EditButton(), RS_(L"ColorScheme_EditButton/Text"));
         Automation::AutomationProperties::SetName(AddNewButton(), RS_(L"ColorScheme_AddNewButton/Text"));
-        Automation::AutomationProperties::SetName(DeleteButton(), RS_(L"ColorScheme_DeleteButton/Text"));
+        Automation::AutomationProperties::SetName(DeleteButton(), RS_(L"ColorScheme_DeleteButton2/Text"));
     }
 
     void ColorSchemes::OnNavigatedTo(const NavigationEventArgs& e)
     {
         _ViewModel = e.Parameter().as<Editor::ColorSchemesPageViewModel>();
+        _ViewModel.CurrentPage(ColorSchemesSubPage::Base);
     }
 
     void ColorSchemes::DeleteConfirmation_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
@@ -65,74 +55,64 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         // an issue, we'll already correctly focus the Delete button.
         //
         // However, it seems even more useful for focus to ALWAYS land on the
-        // scheme dropdown box. This forces Narrator to read the name of the
+        // scheme list view. This forces Narrator to read the name of the
         // newly selected color scheme, which seemed more useful.
-        ColorSchemeComboBox().Focus(FocusState::Programmatic);
-    }
 
-    // Function Description:
-    // - Pre-populates/focuses the name TextBox, updates the UI
-    // Arguments:
-    // - <unused>
-    // Return Value:
-    // - <none>
-    void ColorSchemes::Rename_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
-    {
-        NameBox().Text(_ViewModel.CurrentScheme().Name());
-        _ViewModel.RequestEnterRename();
-        NameBox().Focus(FocusState::Programmatic);
-        NameBox().SelectAll();
+        // For some reason, if we just call ColorSchemeListView().Focus(FocusState::Programmatic),
+        // focus always lands on the _first_ item of the list view, regardless of what the currently
+        // selected item is. So we need to grab the item container and focus that.
+        const auto itemContainer = ColorSchemeListView().ContainerFromIndex(ColorSchemeListView().SelectedIndex());
+        itemContainer.as<ContentControl>().Focus(FocusState::Programmatic);
     }
 
-    void ColorSchemes::RenameAccept_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
+    void ColorSchemes::AddNew_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
     {
-        _RenameCurrentScheme(NameBox().Text());
-        RenameButton().Focus(FocusState::Programmatic);
+        if (const auto newSchemeVM{ _ViewModel.RequestAddNew() })
+        {
+            ColorSchemeListView().SelectedItem(newSchemeVM);
+            ColorSchemeListView().ScrollIntoView(newSchemeVM);
+        }
     }
 
-    void ColorSchemes::RenameCancel_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
+    void ColorSchemes::Edit_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
     {
-        _ViewModel.RequestExitRename(false, {});
-        RenameErrorTip().IsOpen(false);
-        RenameButton().Focus(FocusState::Programmatic);
+        _ViewModel.RequestEditSelectedScheme();
     }
 
-    void ColorSchemes::NameBox_PreviewKeyDown(const IInspectable& /*sender*/, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e)
+    void ColorSchemes::ListView_PreviewKeyDown(const IInspectable& /*sender*/, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e)
     {
         if (e.OriginalKey() == winrt::Windows::System::VirtualKey::Enter)
         {
-            _RenameCurrentScheme(NameBox().Text());
+            // Treat this as if 'edit' was clicked
+            _ViewModel.RequestEditSelectedScheme();
             e.Handled(true);
         }
-        else if (e.OriginalKey() == winrt::Windows::System::VirtualKey::Escape)
+        else if (e.OriginalKey() == winrt::Windows::System::VirtualKey::Delete)
         {
-            RenameErrorTip().IsOpen(false);
+            // Treat this as if 'delete' was clicked
+            DeleteConfirmation_Click(nullptr, nullptr);
             e.Handled(true);
         }
-        ColorSchemeComboBox().Focus(FocusState::Programmatic);
     }
 
-    void ColorSchemes::_RenameCurrentScheme(hstring newName)
+    void ColorSchemes::ListView_SelectionChanged(const IInspectable& /*sender*/, const winrt::Windows::UI::Xaml::Controls::SelectionChangedEventArgs& e)
     {
-        if (_ViewModel.RequestExitRename(true, newName))
+        if (const auto addedItems{ e.AddedItems() }; addedItems && addedItems.Size() > 0)
         {
-            // update the UI
-            RenameErrorTip().IsOpen(false);
-
-            // The color scheme is renamed appropriately, but the ComboBox still shows the old name (until you open it)
-            // We need to manually force the ComboBox to refresh itself.
-            const auto selectedIndex{ ColorSchemeComboBox().SelectedIndex() };
-            ColorSchemeComboBox().SelectedIndex((selectedIndex + 1) % ViewModel().AllColorSchemes().Size());
-            ColorSchemeComboBox().SelectedIndex(selectedIndex);
-        }
-        else
-        {
-            RenameErrorTip().Target(NameBox());
-            RenameErrorTip().IsOpen(true);
-
-            // focus the name box
-            NameBox().Focus(FocusState::Programmatic);
-            NameBox().SelectAll();
+            if (const auto selectedScheme{ addedItems.GetAt(0).try_as<Editor::ColorSchemeViewModel>() })
+            {
+                if (selectedScheme.IsInBoxScheme())
+                {
+                    // display disclaimer that this scheme can't be deleted
+                    SelectedSchemeDisclaimer().Text(RS_(L"ColorScheme_DeleteDisclaimerInBox"));
+                    SelectedSchemeDisclaimer().Visibility(Visibility::Visible);
+                }
+                else
+                {
+                    // hide the disclaimer
+                    SelectedSchemeDisclaimer().Visibility(Visibility::Collapsed);
+                }
+            }
         }
     }
 }
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemes.h b/src/cascadia/TerminalSettingsEditor/ColorSchemes.h
index a70df37c2ab..152a0fffea3 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemes.h
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemes.h
@@ -17,20 +17,16 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
 
         void OnNavigatedTo(const winrt::Windows::UI::Xaml::Navigation::NavigationEventArgs& e);
 
-        void Rename_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
-        void RenameAccept_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
-        void RenameCancel_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
-        void NameBox_PreviewKeyDown(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e);
-
+        void AddNew_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
+        void ListView_PreviewKeyDown(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e);
+        void ListView_SelectionChanged(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::Controls::SelectionChangedEventArgs& e);
         void DeleteConfirmation_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
+        void Edit_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
 
         WINRT_PROPERTY(Model::ColorScheme, CurrentColorScheme, nullptr);
         WINRT_OBSERVABLE_PROPERTY(Editor::ColorSchemesPageViewModel, ViewModel, _PropertyChangedHandlers, nullptr);
 
         WINRT_CALLBACK(PropertyChanged, Windows::UI::Xaml::Data::PropertyChangedEventHandler);
-
-    private:
-        void _RenameCurrentScheme(hstring newName);
     };
 }
 
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemes.xaml b/src/cascadia/TerminalSettingsEditor/ColorSchemes.xaml
index 201b87b6e3e..0ab57e53d2e 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemes.xaml
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemes.xaml
@@ -18,139 +18,199 @@
                 <ResourceDictionary Source="CommonResources.xaml" />
             </ResourceDictionary.MergedDictionaries>
 
-            <Style x:Key="GroupHeaderStyle"
-                   BasedOn="{StaticResource SubtitleTextBlockStyle}"
-                   TargetType="TextBlock">
-                <Setter Property="Margin" Value="0,0,0,4" />
-            </Style>
-
-            <Style x:Key="ColorLabelStyle"
-                   TargetType="TextBlock">
-                <Setter Property="HorizontalAlignment" Value="Left" />
-                <Setter Property="VerticalAlignment" Value="Center" />
-            </Style>
-
-            <Style x:Key="ColorTableGridStyle"
-                   TargetType="Grid">
-                <Setter Property="RowSpacing" Value="10" />
-                <Setter Property="ColumnSpacing" Value="10" />
-            </Style>
-
-            <Style x:Key="ColorControlStyle"
-                   TargetType="ContentControl">
-                <Setter Property="IsTabStop" Value="False" />
-            </Style>
-
-            <Style x:Key="ColorSchemesColorButtonStyle"
-                   BasedOn="{StaticResource ColorButtonStyle}"
-                   TargetType="Button">
-                <Setter Property="Width" Value="96" />
-            </Style>
-
-            <Style TargetType="ColorPicker">
-                <Setter Property="IsColorSliderVisible" Value="False" />
-                <Setter Property="IsColorChannelTextInputVisible" Value="False" />
-                <Setter Property="IsHexInputVisible" Value="True" />
-                <Setter Property="IsAlphaSliderVisible" Value="True" />
-                <Setter Property="IsAlphaTextInputVisible" Value="True" />
-            </Style>
-
-            <DataTemplate x:Key="ColorTableEntryTemplate"
+            <DataTemplate x:Key="ColorPreviewChipTemplate"
                           x:DataType="local:ColorTableEntry">
-                <Button AutomationProperties.Name="{x:Bind Name}"
-                        Background="{x:Bind local:Converters.ColorToBrush(Color), Mode=OneWay}"
-                        Style="{StaticResource ColorSchemesColorButtonStyle}"
-                        ToolTipService.ToolTip="{x:Bind Name}">
-                    <Button.Flyout>
-                        <Flyout>
-                            <muxc:ColorPicker Tag="{x:Bind Tag, Mode=OneWay}"
-                                              Color="{x:Bind Color, Mode=TwoWay}" />
-                        </Flyout>
-                    </Button.Flyout>
-                </Button>
+                <Border Width="15"
+                        Height="15"
+                        Background="{x:Bind local:Converters.ColorToBrush(Color)}"
+                        CornerRadius="2" />
             </DataTemplate>
 
+            <Style x:Key="SchemeGridStyle"
+                   TargetType="Grid">
+                <!--  Loosely based on NonExpanderGrid style  -->
+                <Setter Property="MinWidth" Value="{ThemeResource FlyoutThemeMinWidth}" />
+                <Setter Property="MinHeight" Value="64" />
+                <Setter Property="Padding" Value="16,0,8,0" />
+            </Style>
         </ResourceDictionary>
     </Page.Resources>
 
     <ScrollViewer ViewChanging="ViewChanging">
-        <StackPanel MaxWidth="{StaticResource StandardControlMaxWidth}"
-                    Margin="{StaticResource StandardIndentMargin}"
-                    Spacing="24">
-
+        <StackPanel Style="{StaticResource SettingsStackStyle}">
             <TextBlock x:Uid="ColorSchemesDisclaimer"
-                       Margin="{StaticResource StandardIndentMargin}"
                        Style="{StaticResource DisclaimerStyle}" />
 
-            <!--  Select Color and Add New Button  -->
-            <StackPanel Margin="0,5,0,0"
-                        Orientation="Horizontal">
-
-                <StackPanel Orientation="Horizontal"
-                            Visibility="{x:Bind local:Converters.InvertedBooleanToVisibility(ViewModel.InRenameMode), Mode=OneWay}">
-                    <!--  Select a color scheme  -->
-                    <ComboBox x:Name="ColorSchemeComboBox"
-                              ItemsSource="{x:Bind ViewModel.AllColorSchemes, Mode=OneWay}"
-                              SelectedItem="{x:Bind ViewModel.CurrentScheme, Mode=TwoWay}"
-                              Style="{StaticResource ComboBoxSettingStyle}">
-                        <ComboBox.ItemTemplate>
-                            <DataTemplate x:DataType="local:ColorSchemeViewModel">
-                                <TextBlock Text="{x:Bind Name, Mode=OneWay}" />
-                            </DataTemplate>
-                        </ComboBox.ItemTemplate>
-                    </ComboBox>
-
-                    <!--  Rename Button  -->
-                    <!--  Bind IsEnabled to prevent a the color scheme from returning from the dead  -->
-                    <Button x:Name="RenameButton"
-                            x:Uid="Rename"
-                            Click="Rename_Click"
-                            IsEnabled="{x:Bind ViewModel.CanDeleteCurrentScheme, Mode=OneWay}"
-                            Style="{StaticResource SmallButtonStyle}">
-                        <StackPanel Orientation="Horizontal">
-                            <FontIcon FontSize="{StaticResource StandardIconSize}"
-                                      Glyph="&#xE8AC;" />
-                        </StackPanel>
-                    </Button>
-                </StackPanel>
-
-                <StackPanel Orientation="Horizontal"
-                            Visibility="{x:Bind ViewModel.InRenameMode, Mode=OneWay}">
-
-                    <!--  Shown when color scheme name is already in use  -->
-                    <muxc:TeachingTip x:Name="RenameErrorTip"
-                                      x:Uid="ColorScheme_RenameErrorTip" />
-
-                    <!--  Name text box  -->
-                    <TextBox x:Name="NameBox"
-                             PreviewKeyDown="NameBox_PreviewKeyDown"
-                             Style="{StaticResource TextBoxSettingStyle}" />
-
-                    <!--  Accept rename button  -->
-                    <Button x:Name="RenameAcceptButton"
-                            x:Uid="RenameAccept"
-                            Click="RenameAccept_Click"
-                            Style="{StaticResource AccentSmallButtonStyle}">
-                        <StackPanel Orientation="Horizontal">
-                            <FontIcon FontSize="{StaticResource StandardIconSize}"
-                                      Glyph="&#xE8FB;" />
-                        </StackPanel>
-                    </Button>
-                    <!--  Cancel rename button  -->
-                    <Button x:Name="RenameCancelButton"
-                            x:Uid="RenameCancel"
-                            Click="RenameCancel_Click"
-                            Style="{StaticResource SmallButtonStyle}">
-                        <StackPanel Orientation="Horizontal">
-                            <FontIcon FontSize="{StaticResource StandardIconSize}"
-                                      Glyph="&#xE711;" />
-                        </StackPanel>
-                    </Button>
-                </StackPanel>
+            <ListView x:Name="ColorSchemeListView"
+                      MaxWidth="{StaticResource StandardControlMaxWidth}"
+                      ItemsSource="{x:Bind ViewModel.AllColorSchemes, Mode=OneWay}"
+                      PreviewKeyDown="ListView_PreviewKeyDown"
+                      SelectedItem="{x:Bind ViewModel.CurrentScheme, Mode=TwoWay}"
+                      SelectionChanged="ListView_SelectionChanged"
+                      SelectionMode="Single">
+                <ListView.ItemTemplate>
+                    <DataTemplate x:DataType="local:ColorSchemeViewModel">
+                        <Grid MaxWidth="1000"
+                              Margin="0,2,0,2"
+                              Style="{StaticResource SchemeGridStyle}">
+                            <Grid.ColumnDefinitions>
+                                <ColumnDefinition Width="Auto" />
+                                <ColumnDefinition Width="*" />
+                                <ColumnDefinition Width="Auto" />
+                            </Grid.ColumnDefinitions>
+                            <TextBlock Grid.Column="0"
+                                       VerticalAlignment="Center"
+                                       Style="{StaticResource SettingsPageItemHeaderStyle}"
+                                       Text="{x:Bind Name, Mode=OneWay}" />
+                            <Border Grid.Column="1"
+                                    Margin="10,0,0,0"
+                                    Padding="2,0,2,0"
+                                    HorizontalAlignment="Left"
+                                    VerticalAlignment="Center"
+                                    Background="{ThemeResource SystemAltMediumLowColor}"
+                                    BorderBrush="{ThemeResource SystemControlForegroundBaseMediumBrush}"
+                                    BorderThickness="1"
+                                    CornerRadius="1"
+                                    Visibility="{x:Bind IsDefaultScheme, Mode=OneWay}">
+                                <TextBlock x:Uid="ColorScheme_DefaultTag"
+                                           Grid.Column="1"
+                                           Foreground="{ThemeResource SystemControlForegroundBaseMediumBrush}" />
+                            </Border>
+                            <Grid Grid.Column="2"
+                                  VerticalAlignment="Center"
+                                  ColumnSpacing="4"
+                                  RowSpacing="4">
+                                <Grid.ColumnDefinitions>
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                    <ColumnDefinition Width="Auto" />
+                                </Grid.ColumnDefinitions>
+                                <Grid.RowDefinitions>
+                                    <RowDefinition Height="Auto" />
+                                    <RowDefinition Height="Auto" />
+                                </Grid.RowDefinitions>
+                                <Border Grid.RowSpan="2"
+                                        Grid.Column="0"
+                                        Background="{x:Bind local:Converters.ColorToBrush(BackgroundColor.Color), Mode=OneWay}"
+                                        CornerRadius="2">
+                                    <TextBlock Padding="10,0,10,0"
+                                               HorizontalAlignment="Center"
+                                               VerticalAlignment="Center"
+                                               AutomationProperties.AccessibilityView="Raw"
+                                               FontFamily="Cascadia Code"
+                                               Foreground="{x:Bind local:Converters.ColorToBrush(ForegroundColor.Color), Mode=OneWay}"
+                                               Text="AaBbCc" />
+                                </Border>
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="1"
+                                                Content="{x:Bind ColorEntryAt(0), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="2"
+                                                Content="{x:Bind ColorEntryAt(1), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="3"
+                                                Content="{x:Bind ColorEntryAt(2), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="4"
+                                                Content="{x:Bind ColorEntryAt(3), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="5"
+                                                Content="{x:Bind ColorEntryAt(4), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="6"
+                                                Content="{x:Bind ColorEntryAt(5), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="7"
+                                                Content="{x:Bind ColorEntryAt(6), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="0"
+                                                Grid.Column="8"
+                                                Content="{x:Bind ColorEntryAt(7), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="1"
+                                                Content="{x:Bind ColorEntryAt(8), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="2"
+                                                Content="{x:Bind ColorEntryAt(9), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="3"
+                                                Content="{x:Bind ColorEntryAt(10), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="4"
+                                                Content="{x:Bind ColorEntryAt(11), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="5"
+                                                Content="{x:Bind ColorEntryAt(12), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="6"
+                                                Content="{x:Bind ColorEntryAt(13), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="7"
+                                                Content="{x:Bind ColorEntryAt(14), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                                <ContentControl Grid.Row="1"
+                                                Grid.Column="8"
+                                                Content="{x:Bind ColorEntryAt(15), Mode=OneWay}"
+                                                ContentTemplate="{StaticResource ColorPreviewChipTemplate}"
+                                                IsTabStop="False" />
+                            </Grid>
+                        </Grid>
+                    </DataTemplate>
+                </ListView.ItemTemplate>
+            </ListView>
+
+            <StackPanel MaxWidth="{StaticResource StandardControlMaxWidth}"
+                        Margin="0,8,0,0"
+                        Orientation="Horizontal"
+                        XYFocusKeyboardNavigation="Enabled">
+                <Button x:Name="EditButton"
+                        Click="{x:Bind ViewModel.RequestEditSelectedScheme}"
+                        IsEnabled="{x:Bind ViewModel.HasCurrentScheme, Mode=OneWay}"
+                        Style="{StaticResource BrowseButtonStyle}">
+                    <StackPanel Orientation="Horizontal">
+                        <FontIcon FontSize="{StaticResource StandardIconSize}"
+                                  Glyph="&#xE70F;" />
+                        <TextBlock x:Uid="ColorScheme_EditButton"
+                                   Style="{StaticResource IconButtonTextBlockStyle}" />
+                    </StackPanel>
+                </Button>
 
-                <!--  Add new button  -->
                 <Button x:Name="AddNewButton"
-                        Click="{x:Bind ViewModel.AddNew_Click}"
+                        Click="AddNew_Click"
                         Style="{StaticResource BrowseButtonStyle}">
                     <StackPanel Orientation="Horizontal">
                         <FontIcon FontSize="{StaticResource StandardIconSize}"
@@ -159,246 +219,16 @@
                                    Style="{StaticResource IconButtonTextBlockStyle}" />
                     </StackPanel>
                 </Button>
-            </StackPanel>
-
-            <!--  Terminal Colors (Left Column)  -->
-            <StackPanel x:Name="ColorPanel"
-                        Spacing="48">
-                <StackPanel>
-                    <TextBlock x:Uid="ColorScheme_TerminalColorsHeader"
-                               Style="{StaticResource GroupHeaderStyle}" />
-                    <Grid x:Name="ColorTableGrid"
-                          Style="{StaticResource ColorTableGridStyle}">
-                        <Grid.ColumnDefinitions>
-                            <!--  Labels  -->
-                            <ColumnDefinition Width="Auto" />
-
-                            <!--  Regular Colors  -->
-                            <ColumnDefinition Width="Auto" />
 
-                            <!--  Bright Colors  -->
-                            <ColumnDefinition Width="Auto" />
-                        </Grid.ColumnDefinitions>
-
-                        <Grid.RowDefinitions>
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                        </Grid.RowDefinitions>
-                        <TextBlock x:Uid="ColorScheme_Black"
-                                   Grid.Row="0"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightBlack"
-                                        Grid.Row="0"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(0), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Red"
-                                   Grid.Row="1"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightRed"
-                                        Grid.Row="1"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(1), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Green"
-                                   Grid.Row="2"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightGreen"
-                                        Grid.Row="2"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(2), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Yellow"
-                                   Grid.Row="3"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightYellow"
-                                        Grid.Row="3"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(3), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Blue"
-                                   Grid.Row="4"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightBlue"
-                                        Grid.Row="4"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(4), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Purple"
-                                   Grid.Row="5"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightPurple"
-                                        Grid.Row="5"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(5), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_Cyan"
-                                   Grid.Row="6"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightCyan"
-                                        Grid.Row="6"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(6), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <TextBlock x:Uid="ColorScheme_White"
-                                   Grid.Row="7"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="NonBrightWhite"
-                                        Grid.Row="7"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(7), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightBlack"
-                                        Grid.Row="0"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(8), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightRed"
-                                        Grid.Row="1"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(9), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightGreen"
-                                        Grid.Row="2"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(10), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightYellow"
-                                        Grid.Row="3"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(11), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightBlue"
-                                        Grid.Row="4"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(12), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightPurple"
-                                        Grid.Row="5"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(13), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightCyan"
-                                        Grid.Row="6"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(14), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                        <ContentControl x:Name="BrightWhite"
-                                        Grid.Row="7"
-                                        Grid.Column="2"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ColorEntryAt(15), Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                    </Grid>
-                </StackPanel>
-
-                <!--  System Colors (Right Column)  -->
-                <StackPanel>
-                    <TextBlock x:Uid="ColorScheme_SystemColorsHeader"
-                               Style="{StaticResource GroupHeaderStyle}" />
-                    <Grid Style="{StaticResource ColorTableGridStyle}">
-
-                        <Grid.ColumnDefinitions>
-                            <ColumnDefinition Width="Auto" />
-                            <ColumnDefinition Width="Auto" />
-                        </Grid.ColumnDefinitions>
-
-                        <Grid.RowDefinitions>
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                            <RowDefinition Height="Auto" />
-                        </Grid.RowDefinitions>
-
-                        <!--  Foreground  -->
-                        <TextBlock x:Uid="ColorScheme_Foreground"
-                                   Grid.Row="0"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="ForegroundButton"
-                                        Grid.Row="0"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.ForegroundColor, Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-
-                        <!--  Background  -->
-                        <TextBlock x:Uid="ColorScheme_Background"
-                                   Grid.Row="1"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="BackgroundButton"
-                                        Grid.Row="1"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.BackgroundColor, Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-
-                        <!--  Cursor Color  -->
-                        <TextBlock x:Uid="ColorScheme_CursorColor"
-                                   Grid.Row="2"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="CursorColorButton"
-                                        Grid.Row="2"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.CursorColor, Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-
-                        <!--  Selection Background  -->
-                        <TextBlock x:Uid="ColorScheme_SelectionBackground"
-                                   Grid.Row="3"
-                                   Grid.Column="0"
-                                   Style="{StaticResource ColorLabelStyle}" />
-                        <ContentControl x:Name="SelectionBackgroundButton"
-                                        Grid.Row="3"
-                                        Grid.Column="1"
-                                        Content="{x:Bind ViewModel.CurrentScheme.SelectionBackgroundColor, Mode=OneWay}"
-                                        ContentTemplate="{StaticResource ColorTableEntryTemplate}"
-                                        Style="{StaticResource ColorControlStyle}" />
-                    </Grid>
-                </StackPanel>
-            </StackPanel>
-
-            <!--  Delete Button  -->
-            <StackPanel Style="{StaticResource PivotStackStyle}">
                 <Button x:Name="DeleteButton"
+                        Margin="10,0,0,0"
                         IsEnabled="{x:Bind ViewModel.CanDeleteCurrentScheme, Mode=OneWay}"
                         Style="{StaticResource DeleteButtonStyle}">
                     <Button.Content>
                         <StackPanel Orientation="Horizontal">
-                            <FontIcon Glyph="&#xE74D;" />
-                            <TextBlock x:Uid="ColorScheme_DeleteButton"
+                            <FontIcon FontSize="{StaticResource StandardIconSize}"
+                                      Glyph="&#xE74D;" />
+                            <TextBlock x:Uid="ColorScheme_DeleteButton2"
                                        Style="{StaticResource IconButtonTextBlockStyle}" />
                         </StackPanel>
                     </Button.Content>
@@ -413,28 +243,18 @@
                         </Flyout>
                     </Button.Flyout>
                 </Button>
-                <TextBlock x:Uid="ColorScheme_DeleteButtonDisclaimerInBox"
-                           VerticalAlignment="Center"
-                           Style="{StaticResource DisclaimerStyle}"
-                           Visibility="{x:Bind local:Converters.InvertedBooleanToVisibility(ViewModel.CanDeleteCurrentScheme), Mode=OneWay}" />
+
+                <Button x:Uid="ColorScheme_SetAsDefaultButton"
+                        Margin="10,0,0,0"
+                        Click="{x:Bind ViewModel.RequestSetSelectedSchemeAsDefault}"
+                        IsEnabled="{x:Bind ViewModel.HasCurrentScheme, Mode=OneWay}"
+                        Style="{StaticResource BrowseButtonStyle}" />
             </StackPanel>
-        </StackPanel>
-        <VisualStateManager.VisualStateGroups>
-            <VisualStateGroup>
-                <VisualState>
-                    <VisualState.StateTriggers>
-                        <!--
-                            Official guidance states that 640 is the breakpoint between small and medium devices.
-                            Since MinWindowWidth is an inclusive range, we need to add 1 to it.
-                        -->
-                        <AdaptiveTrigger MinWindowWidth="641" />
-                    </VisualState.StateTriggers>
 
-                    <VisualState.Setters>
-                        <Setter Target="ColorPanel.Orientation" Value="Horizontal" />
-                    </VisualState.Setters>
-                </VisualState>
-            </VisualStateGroup>
-        </VisualStateManager.VisualStateGroups>
+            <TextBlock x:Name="SelectedSchemeDisclaimer"
+                       Margin="10,8,0,0"
+                       VerticalAlignment="Center"
+                       Style="{StaticResource DisclaimerStyle}" />
+        </StackPanel>
     </ScrollViewer>
 </Page>
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.cpp b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.cpp
index 5f414ce71c5..fa9e1caabe5 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.cpp
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.cpp
@@ -24,16 +24,12 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         _viewModelToSchemeMap{ winrt::single_threaded_map<Editor::ColorSchemeViewModel, Model::ColorScheme>() }
     {
         _MakeColorSchemeVMsHelper();
-        CurrentScheme(_AllColorSchemes.GetAt(0));
     }
 
     void ColorSchemesPageViewModel::UpdateSettings(const Model::CascadiaSettings& settings)
     {
         _settings = settings;
 
-        // Exit rename mode if we're in it
-        InRenameMode(false);
-
         // We want to re-initialize our AllColorSchemes list, but we want to make sure
         // we still have the same CurrentScheme as before (if that scheme still exists)
 
@@ -57,8 +53,8 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         }
         if (!it.HasCurrent())
         {
-            // we didn't find the previously selected scheme, just select the first one
-            CurrentScheme(_AllColorSchemes.GetAt(0));
+            // we didn't find the previously selected scheme
+            CurrentScheme(nullptr);
         }
     }
 
@@ -67,8 +63,7 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         if (_CurrentScheme != newSelectedScheme)
         {
             _CurrentScheme = newSelectedScheme;
-            _propertyChangedHandlers(*this, Windows::UI::Xaml::Data::PropertyChangedEventArgs{ L"CurrentScheme" });
-            _propertyChangedHandlers(*this, Windows::UI::Xaml::Data::PropertyChangedEventArgs{ L"CanDeleteCurrentScheme" });
+            _NotifyChanges(L"CurrentScheme", L"CanDeleteCurrentScheme", L"HasCurrentScheme");
         }
     }
 
@@ -77,9 +72,9 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         return _CurrentScheme;
     }
 
-    void ColorSchemesPageViewModel::AddNew_Click(const IInspectable& /*sender*/, const winrt::Windows::UI::Xaml::RoutedEventArgs& /*e*/)
+    bool ColorSchemesPageViewModel::HasCurrentScheme() const noexcept
     {
-        CurrentScheme(_AddNewScheme());
+        return _CurrentScheme != nullptr;
     }
 
     void ColorSchemesPageViewModel::_MakeColorSchemeVMsHelper()
@@ -90,7 +85,8 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         for (const auto& pair : colorSchemeMap)
         {
             const auto scheme = pair.Value();
-            Editor::ColorSchemeViewModel viewModel{ scheme };
+            auto viewModel{ winrt::make<ColorSchemeViewModel>(scheme, *this, _settings) };
+            viewModel.IsInBoxScheme(std::find(std::begin(InBoxSchemes), std::end(InBoxSchemes), scheme.Name()) != std::end(InBoxSchemes));
             allColorSchemes.emplace_back(viewModel);
 
             // We will need access to the settings model object later, but we don't
@@ -100,36 +96,44 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         }
 
         _AllColorSchemes = single_threaded_observable_vector<Editor::ColorSchemeViewModel>(std::move(allColorSchemes));
-        _propertyChangedHandlers(*this, Windows::UI::Xaml::Data::PropertyChangedEventArgs{ L"AllColorSchemes" });
+        _NotifyChanges(L"AllColorSchemes");
     }
 
-    void ColorSchemesPageViewModel::RequestEnterRename()
+    Editor::ColorSchemeViewModel ColorSchemesPageViewModel::RequestAddNew()
     {
-        InRenameMode(true);
+        const hstring schemeName{ fmt::format(L"Color Scheme {}", _settings.GlobalSettings().ColorSchemes().Size() + 1) };
+        Model::ColorScheme scheme{ schemeName };
+
+        // Add the new color scheme
+        _settings.GlobalSettings().AddColorScheme(scheme);
+
+        // Construct the new color scheme VM
+        const auto schemeVM{ winrt::make<ColorSchemeViewModel>(scheme, *this, _settings) };
+        _AllColorSchemes.Append(schemeVM);
+        _viewModelToSchemeMap.Insert(schemeVM, scheme);
+        return schemeVM;
     }
 
-    bool ColorSchemesPageViewModel::RequestExitRename(bool saveChanges, hstring newName)
+    bool ColorSchemesPageViewModel::RequestRenameCurrentScheme(hstring newName)
     {
-        InRenameMode(false);
-        if (saveChanges)
+        // check if different name is already in use
+        const auto oldName{ CurrentScheme().Name() };
+        if (newName != oldName && _settings.GlobalSettings().ColorSchemes().HasKey(newName))
         {
-            // check if different name is already in use
-            const auto oldName{ CurrentScheme().Name() };
-            if (newName != oldName && _settings.GlobalSettings().ColorSchemes().HasKey(newName))
-            {
-                return false;
-            }
-            else
-            {
-                // update the settings model
-                CurrentScheme().Name(newName);
-                _settings.GlobalSettings().RemoveColorScheme(oldName);
-                _settings.GlobalSettings().AddColorScheme(_viewModelToSchemeMap.Lookup(CurrentScheme()));
-                _settings.UpdateColorSchemeReferences(oldName, newName);
-                return true;
-            }
+            return false;
+        }
+        else
+        {
+            // update the settings model
+            CurrentScheme().Name(newName);
+            _settings.GlobalSettings().RemoveColorScheme(oldName);
+            _settings.GlobalSettings().AddColorScheme(_viewModelToSchemeMap.Lookup(CurrentScheme()));
+            _settings.UpdateColorSchemeReferences(oldName, newName);
+
+            // We need to let MainPage know so the BreadcrumbBarItem can be updated
+            _NotifyChanges(L"CurrentSchemeName");
+            return true;
         }
-        return false;
     }
 
     void ColorSchemesPageViewModel::RequestDeleteCurrentScheme()
@@ -143,7 +147,6 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
             {
                 _viewModelToSchemeMap.Remove(_AllColorSchemes.GetAt(i));
                 _AllColorSchemes.RemoveAt(i);
-
                 if (i < _AllColorSchemes.Size())
                 {
                     // select same index
@@ -165,19 +168,25 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         _settings.UpdateColorSchemeReferences(name, L"Campbell");
     }
 
-    Editor::ColorSchemeViewModel ColorSchemesPageViewModel::_AddNewScheme()
+    void ColorSchemesPageViewModel::RequestEditSelectedScheme()
     {
-        const hstring schemeName{ fmt::format(L"Color Scheme {}", _settings.GlobalSettings().ColorSchemes().Size() + 1) };
-        Model::ColorScheme scheme{ schemeName };
-
-        // Add the new color scheme
-        _settings.GlobalSettings().AddColorScheme(scheme);
+        if (_CurrentScheme)
+        {
+            CurrentPage(ColorSchemesSubPage::EditColorScheme);
+        }
+    }
 
-        // Construct the new color scheme VM
-        const Editor::ColorSchemeViewModel schemeVM{ scheme };
-        _AllColorSchemes.Append(schemeVM);
-        _viewModelToSchemeMap.Insert(schemeVM, scheme);
-        return schemeVM;
+    void ColorSchemesPageViewModel::RequestSetSelectedSchemeAsDefault()
+    {
+        if (_CurrentScheme)
+        {
+            _settings.ProfileDefaults().DefaultAppearance().ColorSchemeName(_CurrentScheme.Name());
+            for (const auto scheme : _AllColorSchemes)
+            {
+                auto schemeImpl{ get_self<ColorSchemeViewModel>(scheme) };
+                schemeImpl->RefreshIsDefault();
+            }
+        }
     }
 
     bool ColorSchemesPageViewModel::CanDeleteCurrentScheme() const
@@ -185,7 +194,7 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         if (_CurrentScheme)
         {
             // Only allow this color scheme to be deleted if it's not provided in-box
-            return std::find(std::begin(InBoxSchemes), std::end(InBoxSchemes), _CurrentScheme.Name()) == std::end(InBoxSchemes);
+            return !_CurrentScheme.IsInBoxScheme();
         }
         return false;
     }
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.h b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.h
index 3cace06267b..c03c976e6ca 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.h
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.h
@@ -19,19 +19,20 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
 
         void CurrentScheme(const Editor::ColorSchemeViewModel& newSelectedScheme);
         Editor::ColorSchemeViewModel CurrentScheme();
+        bool HasCurrentScheme() const noexcept;
 
-        void AddNew_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
-
-        void RequestEnterRename();
-        bool RequestExitRename(bool saveChanges, winrt::hstring newName);
+        Editor::ColorSchemeViewModel RequestAddNew();
+        bool RequestRenameCurrentScheme(winrt::hstring newName);
         void RequestDeleteCurrentScheme();
+        void RequestEditSelectedScheme();
+        void RequestSetSelectedSchemeAsDefault();
 
         bool CanDeleteCurrentScheme() const;
 
         // DON'T YOU DARE ADD A `WINRT_CALLBACK(PropertyChanged` TO A CLASS DERIVED FROM ViewModelHelper. Do this instead:
         using ViewModelHelper<ColorSchemesPageViewModel>::PropertyChanged;
 
-        WINRT_OBSERVABLE_PROPERTY(bool, InRenameMode, _propertyChangedHandlers, false);
+        WINRT_OBSERVABLE_PROPERTY(ColorSchemesSubPage, CurrentPage, _propertyChangedHandlers, ColorSchemesSubPage::Base);
         WINRT_OBSERVABLE_PROPERTY(Windows::Foundation::Collections::IObservableVector<Editor::ColorSchemeViewModel>, AllColorSchemes, _propertyChangedHandlers, nullptr);
 
     private:
@@ -40,7 +41,6 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         Windows::Foundation::Collections::IMap<Editor::ColorSchemeViewModel, Model::ColorScheme> _viewModelToSchemeMap;
 
         void _MakeColorSchemeVMsHelper();
-        Editor::ColorSchemeViewModel _AddNewScheme();
     };
 };
 
diff --git a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.idl b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.idl
index 544e0d31b98..fb2f7918bba 100644
--- a/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.idl
+++ b/src/cascadia/TerminalSettingsEditor/ColorSchemesPageViewModel.idl
@@ -5,20 +5,27 @@ import "ColorSchemeViewModel.idl";
 
 namespace Microsoft.Terminal.Settings.Editor
 {
+    enum ColorSchemesSubPage
+    {
+        Base = 0,
+        EditColorScheme = 1
+    };
+
     runtimeclass ColorSchemesPageViewModel : Windows.UI.Xaml.Data.INotifyPropertyChanged
     {
         ColorSchemesPageViewModel(Microsoft.Terminal.Settings.Model.CascadiaSettings settings);
         void UpdateSettings(Microsoft.Terminal.Settings.Model.CascadiaSettings settings);
 
-        void AddNew_Click(IInspectable sender, Windows.UI.Xaml.RoutedEventArgs e);
-
-        void RequestEnterRename();
-        Boolean RequestExitRename(Boolean saveChanges, String newName);
+        ColorSchemeViewModel RequestAddNew();
+        Boolean RequestRenameCurrentScheme(String newName);
         void RequestDeleteCurrentScheme();
+        void RequestEditSelectedScheme();
+        void RequestSetSelectedSchemeAsDefault();
 
         ColorSchemeViewModel CurrentScheme;
+        Boolean HasCurrentScheme { get; };
         Boolean CanDeleteCurrentScheme { get; };
-        Boolean InRenameMode { get; };
+        ColorSchemesSubPage CurrentPage;
         Windows.Foundation.Collections.IObservableVector<ColorSchemeViewModel> AllColorSchemes { get; };
     }
 }
diff --git a/src/cascadia/TerminalSettingsEditor/EditColorScheme.cpp b/src/cascadia/TerminalSettingsEditor/EditColorScheme.cpp
new file mode 100644
index 00000000000..ab7333e0c5c
--- /dev/null
+++ b/src/cascadia/TerminalSettingsEditor/EditColorScheme.cpp
@@ -0,0 +1,142 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+#include "pch.h"
+#include "EditColorScheme.h"
+#include "EditColorScheme.g.cpp"
+
+#include <LibraryResources.h>
+
+using namespace winrt;
+using namespace winrt::Windows::UI;
+using namespace winrt::Windows::UI::Xaml;
+using namespace winrt::Windows::UI::Xaml::Navigation;
+using namespace winrt::Windows::UI::Xaml::Controls;
+using namespace winrt::Windows::UI::Xaml::Media;
+using namespace winrt::Windows::Foundation;
+using namespace winrt::Windows::Foundation::Collections;
+using namespace winrt::Microsoft::UI::Xaml::Controls;
+
+namespace winrt
+{
+    namespace MUX = Microsoft::UI::Xaml;
+    namespace WUX = Windows::UI::Xaml;
+}
+
+namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
+{
+    EditColorScheme::EditColorScheme()
+    {
+        InitializeComponent();
+
+        Automation::AutomationProperties::SetName(NameBox(), RS_(L"ColorScheme_Name/Header"));
+        Automation::AutomationProperties::SetFullDescription(NameBox(), RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
+        ToolTipService::SetToolTip(NameBox(), box_value(RS_(L"ColorScheme_Name/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip")));
+        Automation::AutomationProperties::SetName(RenameAcceptButton(), RS_(L"RenameAccept/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
+        Automation::AutomationProperties::SetName(RenameCancelButton(), RS_(L"RenameCancel/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
+    }
+
+    void EditColorScheme::OnNavigatedTo(const NavigationEventArgs& e)
+    {
+        _ViewModel = e.Parameter().as<Editor::ColorSchemeViewModel>();
+
+        // Set the text disclaimer for the text box
+        hstring disclaimer{};
+        if (_ViewModel.IsInBoxScheme())
+        {
+            // load disclaimer for in-box profiles
+            disclaimer = RS_(L"ColorScheme_RenameDisclaimerInBox");
+        }
+        RenameContainer().HelpText(disclaimer);
+
+        NameBox().Text(_ViewModel.Name());
+    }
+
+    void EditColorScheme::ColorPickerChanged(const IInspectable& sender,
+                                             const MUX::Controls::ColorChangedEventArgs& args)
+    {
+        const til::color newColor{ args.NewColor() };
+        if (const auto& picker{ sender.try_as<MUX::Controls::ColorPicker>() })
+        {
+            if (const auto& tag{ picker.Tag() })
+            {
+                if (const auto index{ tag.try_as<uint8_t>() })
+                {
+                    if (index < ColorTableDivider)
+                    {
+                        _ViewModel.NonBrightColorTable().GetAt(*index).Color(newColor);
+                    }
+                    else
+                    {
+                        _ViewModel.BrightColorTable().GetAt(*index - ColorTableDivider).Color(newColor);
+                    }
+                }
+                else if (const auto stringTag{ tag.try_as<hstring>() })
+                {
+                    if (stringTag == ForegroundColorTag)
+                    {
+                        _ViewModel.ForegroundColor().Color(newColor);
+                    }
+                    else if (stringTag == BackgroundColorTag)
+                    {
+                        _ViewModel.BackgroundColor().Color(newColor);
+                    }
+                    else if (stringTag == CursorColorTag)
+                    {
+                        _ViewModel.CursorColor().Color(newColor);
+                    }
+                    else if (stringTag == SelectionBackgroundColorTag)
+                    {
+                        _ViewModel.SelectionBackgroundColor().Color(newColor);
+                    }
+                }
+            }
+        }
+    }
+
+    void EditColorScheme::RenameAccept_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
+    {
+        _RenameCurrentScheme(NameBox().Text());
+    }
+
+    void EditColorScheme::RenameCancel_Click(const IInspectable& /*sender*/, const RoutedEventArgs& /*e*/)
+    {
+        RenameErrorTip().IsOpen(false);
+        NameBox().Text(_ViewModel.Name());
+    }
+
+    void EditColorScheme::NameBox_PreviewKeyDown(const IInspectable& /*sender*/, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e)
+    {
+        if (e.OriginalKey() == winrt::Windows::System::VirtualKey::Enter)
+        {
+            _RenameCurrentScheme(NameBox().Text());
+            e.Handled(true);
+        }
+        else if (e.OriginalKey() == winrt::Windows::System::VirtualKey::Escape)
+        {
+            RenameErrorTip().IsOpen(false);
+            NameBox().Text(_ViewModel.Name());
+            e.Handled(true);
+        }
+    }
+
+    void EditColorScheme::_RenameCurrentScheme(hstring newName)
+    {
+        if (_ViewModel.RequestRename(newName))
+        {
+            // update the UI
+            RenameErrorTip().IsOpen(false);
+
+            NameBox().Focus(FocusState::Programmatic);
+        }
+        else
+        {
+            RenameErrorTip().Target(NameBox());
+            RenameErrorTip().IsOpen(true);
+
+            // focus the name box
+            NameBox().Focus(FocusState::Programmatic);
+            NameBox().SelectAll();
+        }
+    }
+}
diff --git a/src/cascadia/TerminalSettingsEditor/EditColorScheme.h b/src/cascadia/TerminalSettingsEditor/EditColorScheme.h
new file mode 100644
index 00000000000..ae9bc680da0
--- /dev/null
+++ b/src/cascadia/TerminalSettingsEditor/EditColorScheme.h
@@ -0,0 +1,35 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+#pragma once
+
+#include "EditColorScheme.g.h"
+#include "ColorSchemeViewModel.h"
+#include "Utils.h"
+
+namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
+{
+    struct EditColorScheme : public HasScrollViewer<EditColorScheme>, EditColorSchemeT<EditColorScheme>
+    {
+        EditColorScheme();
+
+        void OnNavigatedTo(const winrt::Windows::UI::Xaml::Navigation::NavigationEventArgs& e);
+
+        void ColorPickerChanged(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Microsoft::UI::Xaml::Controls::ColorChangedEventArgs& args);
+        void RenameAccept_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
+        void RenameCancel_Click(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::RoutedEventArgs& e);
+        void NameBox_PreviewKeyDown(const winrt::Windows::Foundation::IInspectable& sender, const winrt::Windows::UI::Xaml::Input::KeyRoutedEventArgs& e);
+
+        WINRT_OBSERVABLE_PROPERTY(Editor::ColorSchemeViewModel, ViewModel, _PropertyChangedHandlers, nullptr);
+
+        WINRT_CALLBACK(PropertyChanged, Windows::UI::Xaml::Data::PropertyChangedEventHandler);
+
+    private:
+        void _RenameCurrentScheme(hstring newName);
+    };
+}
+
+namespace winrt::Microsoft::Terminal::Settings::Editor::factory_implementation
+{
+    BASIC_FACTORY(EditColorScheme);
+}
diff --git a/src/cascadia/TerminalSettingsEditor/EditColorScheme.idl b/src/cascadia/TerminalSettingsEditor/EditColorScheme.idl
new file mode 100644
index 00000000000..33c8ee46589
--- /dev/null
+++ b/src/cascadia/TerminalSettingsEditor/EditColorScheme.idl
@@ -0,0 +1,14 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+import "ColorSchemeViewModel.idl";
+
+namespace Microsoft.Terminal.Settings.Editor
+{
+    [default_interface] runtimeclass EditColorScheme : Windows.UI.Xaml.Controls.Page, Windows.UI.Xaml.Data.INotifyPropertyChanged
+    {
+        EditColorScheme();
+
+        ColorSchemeViewModel ViewModel { get; };
+    }
+}
diff --git a/src/cascadia/TerminalSettingsEditor/EditColorScheme.xaml b/src/cascadia/TerminalSettingsEditor/EditColorScheme.xaml
new file mode 100644
index 00000000000..2292d63998e
--- /dev/null
+++ b/src/cascadia/TerminalSettingsEditor/EditColorScheme.xaml
@@ -0,0 +1,455 @@
+<!--
+    Copyright (c) Microsoft Corporation. All rights reserved. Licensed under
+    the MIT License. See LICENSE in the project root for license information.
+-->
+<Page x:Class="Microsoft.Terminal.Settings.Editor.EditColorScheme"
+      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
+      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
+      xmlns:local="using:Microsoft.Terminal.Settings.Editor"
+      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+      xmlns:model="using:Microsoft.Terminal.Settings.Model"
+      xmlns:muxc="using:Microsoft.UI.Xaml.Controls"
+      mc:Ignorable="d">
+
+    <Page.Resources>
+        <ResourceDictionary>
+            <ResourceDictionary.MergedDictionaries>
+                <ResourceDictionary Source="CommonResources.xaml" />
+            </ResourceDictionary.MergedDictionaries>
+
+            <Style x:Key="GroupHeaderStyle"
+                   BasedOn="{StaticResource SubtitleTextBlockStyle}"
+                   TargetType="TextBlock">
+                <Setter Property="Margin" Value="0,0,0,4" />
+            </Style>
+
+            <Style x:Key="ColorLabelStyle"
+                   TargetType="TextBlock">
+                <Setter Property="HorizontalAlignment" Value="Left" />
+                <Setter Property="VerticalAlignment" Value="Center" />
+            </Style>
+
+            <Style x:Key="ColorTableGridStyle"
+                   TargetType="Grid">
+                <Setter Property="RowSpacing" Value="10" />
+                <Setter Property="ColumnSpacing" Value="10" />
+            </Style>
+
+            <Style x:Key="ColorControlStyle"
+                   TargetType="ContentControl">
+                <Setter Property="IsTabStop" Value="False" />
+            </Style>
+
+            <Style x:Key="ColorSchemesColorButtonStyle"
+                   BasedOn="{StaticResource ColorButtonStyle}"
+                   TargetType="Button" />
+
+            <Style TargetType="ColorPicker">
+                <Setter Property="IsColorSliderVisible" Value="False" />
+                <Setter Property="IsColorChannelTextInputVisible" Value="False" />
+                <Setter Property="IsHexInputVisible" Value="True" />
+                <Setter Property="IsAlphaSliderVisible" Value="True" />
+                <Setter Property="IsAlphaTextInputVisible" Value="True" />
+            </Style>
+
+            <DataTemplate x:Key="ColorTableEntryTemplate"
+                          x:DataType="local:ColorTableEntry">
+                <Button AutomationProperties.Name="{x:Bind Name}"
+                        Background="{x:Bind local:Converters.ColorToBrush(Color), Mode=OneWay}"
+                        Style="{StaticResource ColorSchemesColorButtonStyle}"
+                        ToolTipService.ToolTip="{x:Bind Name}">
+                    <Button.Flyout>
+                        <Flyout>
+                            <muxc:ColorPicker ColorChanged="ColorPickerChanged"
+                                              Tag="{x:Bind Tag, Mode=OneWay}"
+                                              Color="{x:Bind Color, Mode=OneWay}" />
+                        </Flyout>
+                    </Button.Flyout>
+                </Button>
+            </DataTemplate>
+
+            <DataTemplate x:Key="ColorTableTextBlockTemplate"
+                          x:DataType="local:ColorTableEntry">
+                <TextBlock AutomationProperties.Name="{x:Bind Name}"
+                           FontFamily="Cascadia Code"
+                           FontSize="14"
+                           Foreground="{x:Bind local:Converters.ColorToBrush(Color), Mode=OneWay}"
+                           Text="{x:Bind Name}"
+                           ToolTipService.ToolTip="{x:Bind Name}" />
+            </DataTemplate>
+
+        </ResourceDictionary>
+    </Page.Resources>
+
+    <ScrollViewer ViewChanging="ViewChanging">
+        <StackPanel Style="{StaticResource SettingsStackStyle}">
+            <Border MaxWidth="{StaticResource StandardControlMaxWidth}">
+                <!--  Preview of the selected scheme  -->
+                <Grid Width="350"
+                      Height="160"
+                      MaxWidth="{StaticResource StandardControlMaxWidth}"
+                      Margin="4"
+                      HorizontalAlignment="Left"
+                      Background="{x:Bind local:Converters.ColorToBrush(ViewModel.BackgroundColor.Color), Mode=OneWay}"
+                      BorderBrush="{ThemeResource SystemControlForegroundBaseMediumLowBrush}"
+                      BorderThickness="1">
+                    <Grid.ColumnDefinitions>
+                        <ColumnDefinition Width="Auto" />
+                        <ColumnDefinition Width="Auto" />
+                    </Grid.ColumnDefinitions>
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                    </Grid.RowDefinitions>
+                    <ContentControl Grid.Row="0"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ForegroundColor, Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="1"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(0), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="2"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(1), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="3"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(2), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="4"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(3), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="5"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(4), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="6"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(5), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="7"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(6), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="8"
+                                    Grid.Column="0"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(7), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="1"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(8), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="2"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(9), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="3"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(10), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="4"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(11), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="5"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(12), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="6"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(13), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="7"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(14), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+                    <ContentControl Grid.Row="8"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(15), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableTextBlockTemplate}"
+                                    IsTabStop="False" />
+
+                </Grid>
+            </Border>
+
+            <local:SettingContainer x:Uid="ColorScheme_ColorsHeader"
+                                    StartExpanded="True"
+                                    Style="{StaticResource ExpanderSettingContainerStyle}">
+                <Grid x:Name="ColorTableGrid"
+                      Style="{StaticResource ColorTableGridStyle}"
+                      XYFocusKeyboardNavigation="Enabled">
+                    <Grid.ColumnDefinitions>
+                        <!--  Labels  -->
+                        <ColumnDefinition Width="Auto" />
+
+                        <!--  Regular Colors  -->
+                        <ColumnDefinition Width="Auto" />
+
+                        <!--  Bright Colors  -->
+                        <ColumnDefinition Width="Auto" />
+
+                        <ColumnDefinition Width="50" />
+
+                        <!--  Labels  -->
+                        <ColumnDefinition Width="Auto" />
+
+                        <!--  Regular Colors  -->
+                        <ColumnDefinition Width="Auto" />
+
+                        <!--  Bright Colors  -->
+                        <ColumnDefinition Width="Auto" />
+                    </Grid.ColumnDefinitions>
+
+                    <Grid.RowDefinitions>
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                        <RowDefinition Height="Auto" />
+                    </Grid.RowDefinitions>
+                    <TextBlock x:Uid="ColorScheme_Black"
+                               Grid.Row="0"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightBlack"
+                                    Grid.Row="0"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(0), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Red"
+                               Grid.Row="1"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightRed"
+                                    Grid.Row="1"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(1), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Green"
+                               Grid.Row="2"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightGreen"
+                                    Grid.Row="2"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(2), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Yellow"
+                               Grid.Row="3"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightYellow"
+                                    Grid.Row="3"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(3), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Blue"
+                               Grid.Row="4"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightBlue"
+                                    Grid.Row="4"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(4), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Purple"
+                               Grid.Row="5"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightPurple"
+                                    Grid.Row="5"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(5), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_Cyan"
+                               Grid.Row="6"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightCyan"
+                                    Grid.Row="6"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(6), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <TextBlock x:Uid="ColorScheme_White"
+                               Grid.Row="7"
+                               Grid.Column="0"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="NonBrightWhite"
+                                    Grid.Row="7"
+                                    Grid.Column="1"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(7), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightBlack"
+                                    Grid.Row="0"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(8), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightRed"
+                                    Grid.Row="1"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(9), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightGreen"
+                                    Grid.Row="2"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(10), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightYellow"
+                                    Grid.Row="3"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(11), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightBlue"
+                                    Grid.Row="4"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(12), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightPurple"
+                                    Grid.Row="5"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(13), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightCyan"
+                                    Grid.Row="6"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(14), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                    <ContentControl x:Name="BrightWhite"
+                                    Grid.Row="7"
+                                    Grid.Column="2"
+                                    Content="{x:Bind ViewModel.ColorEntryAt(15), Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+
+                    <!--  Foreground  -->
+                    <TextBlock x:Uid="ColorScheme_Foreground"
+                               Grid.Row="0"
+                               Grid.Column="4"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="ForegroundButton"
+                                    Grid.Row="0"
+                                    Grid.Column="5"
+                                    Content="{x:Bind ViewModel.ForegroundColor, Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+
+                    <!--  Background  -->
+                    <TextBlock x:Uid="ColorScheme_Background"
+                               Grid.Row="1"
+                               Grid.Column="4"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="BackgroundButton"
+                                    Grid.Row="1"
+                                    Grid.Column="5"
+                                    Content="{x:Bind ViewModel.BackgroundColor, Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+
+                    <!--  Cursor Color  -->
+                    <TextBlock x:Uid="ColorScheme_CursorColor"
+                               Grid.Row="2"
+                               Grid.Column="4"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="CursorColorButton"
+                                    Grid.Row="2"
+                                    Grid.Column="5"
+                                    Content="{x:Bind ViewModel.CursorColor, Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+
+                    <!--  Selection Background  -->
+                    <TextBlock x:Uid="ColorScheme_SelectionBackground"
+                               Grid.Row="3"
+                               Grid.Column="4"
+                               Style="{StaticResource ColorLabelStyle}" />
+                    <ContentControl x:Name="SelectionBackgroundButton"
+                                    Grid.Row="3"
+                                    Grid.Column="5"
+                                    Content="{x:Bind ViewModel.SelectionBackgroundColor, Mode=OneWay}"
+                                    ContentTemplate="{StaticResource ColorTableEntryTemplate}"
+                                    Style="{StaticResource ColorControlStyle}" />
+                </Grid>
+            </local:SettingContainer>
+
+            <local:SettingContainer x:Name="RenameContainer"
+                                    x:Uid="ColorScheme_Rename"
+                                    IsEnabled="{x:Bind local:Converters.InvertBoolean(ViewModel.IsInBoxScheme), Mode=OneWay}"
+                                    Style="{StaticResource ExpanderSettingContainerStyle}">
+                <StackPanel Orientation="Horizontal"
+                            XYFocusKeyboardNavigation="Enabled">
+                    <!--  Shown when color scheme name is already in use  -->
+                    <muxc:TeachingTip x:Name="RenameErrorTip"
+                                      x:Uid="ColorScheme_RenameErrorTip" />
+                    <!--  Name text box  -->
+                    <TextBox x:Name="NameBox"
+                             PreviewKeyDown="NameBox_PreviewKeyDown"
+                             Style="{StaticResource TextBoxSettingStyle}" />
+                    <!--  Accept rename button  -->
+                    <Button x:Name="RenameAcceptButton"
+                            x:Uid="RenameAccept"
+                            Click="RenameAccept_Click"
+                            Style="{StaticResource AccentSmallButtonStyle}">
+                        <StackPanel Orientation="Horizontal">
+                            <FontIcon FontSize="{StaticResource StandardIconSize}"
+                                      Glyph="&#xE8FB;" />
+                        </StackPanel>
+                    </Button>
+                    <!--  Cancel rename button  -->
+                    <Button x:Name="RenameCancelButton"
+                            x:Uid="RenameCancel"
+                            Click="RenameCancel_Click"
+                            Style="{StaticResource SmallButtonStyle}">
+                        <StackPanel Orientation="Horizontal">
+                            <FontIcon FontSize="{StaticResource StandardIconSize}"
+                                      Glyph="&#xE711;" />
+                        </StackPanel>
+                    </Button>
+                </StackPanel>
+            </local:SettingContainer>
+        </StackPanel>
+    </ScrollViewer>
+</Page>
diff --git a/src/cascadia/TerminalSettingsEditor/MainPage.cpp b/src/cascadia/TerminalSettingsEditor/MainPage.cpp
index 39b78bb788c..a1b8f45854c 100644
--- a/src/cascadia/TerminalSettingsEditor/MainPage.cpp
+++ b/src/cascadia/TerminalSettingsEditor/MainPage.cpp
@@ -59,6 +59,26 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         _InitializeProfilesList();
 
         _colorSchemesPageVM = winrt::make<ColorSchemesPageViewModel>(_settingsClone);
+        _colorSchemesPageViewModelChangedRevoker = _colorSchemesPageVM.PropertyChanged(winrt::auto_revoke, [=](auto&&, const PropertyChangedEventArgs& args) {
+            const auto settingName{ args.PropertyName() };
+            if (settingName == L"CurrentPage")
+            {
+                const auto currentScheme = _colorSchemesPageVM.CurrentScheme();
+                if (_colorSchemesPageVM.CurrentPage() == ColorSchemesSubPage::EditColorScheme && currentScheme)
+                {
+                    contentFrame().Navigate(xaml_typename<Editor::EditColorScheme>(), currentScheme);
+                    const auto crumb = winrt::make<Breadcrumb>(box_value(colorSchemesTag), currentScheme.Name(), BreadcrumbSubPage::ColorSchemes_Edit);
+                    _breadcrumbs.Append(crumb);
+                }
+            }
+            else if (settingName == L"CurrentSchemeName")
+            {
+                // this is not technically a setting, it is the ColorSchemesPageVM telling us the breadcrumb item needs to be updated because of a rename
+                _breadcrumbs.RemoveAtEnd();
+                const auto crumb = winrt::make<Breadcrumb>(box_value(colorSchemesTag), _colorSchemesPageVM.CurrentScheme().Name(), BreadcrumbSubPage::ColorSchemes_Edit);
+                _breadcrumbs.Append(crumb);
+            }
+        });
 
         Automation::AutomationProperties::SetHelpText(SaveButton(), RS_(L"Settings_SaveSettingsButton/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
         Automation::AutomationProperties::SetHelpText(ResetButton(), RS_(L"Settings_ResetSettingsButton/[using:Windows.UI.Xaml.Controls]ToolTipService/ToolTip"));
@@ -393,6 +413,11 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
             contentFrame().Navigate(xaml_typename<Editor::ColorSchemes>(), _colorSchemesPageVM);
             const auto crumb = winrt::make<Breadcrumb>(box_value(clickedItemTag), RS_(L"Nav_ColorSchemes/Content"), BreadcrumbSubPage::None);
             _breadcrumbs.Append(crumb);
+
+            if (subPage == BreadcrumbSubPage::ColorSchemes_Edit)
+            {
+                _colorSchemesPageVM.CurrentPage(ColorSchemesSubPage::EditColorScheme);
+            }
         }
         else if (clickedItemTag == globalAppearanceTag)
         {
diff --git a/src/cascadia/TerminalSettingsEditor/MainPage.h b/src/cascadia/TerminalSettingsEditor/MainPage.h
index 12498ff48c3..956ee1bd5eb 100644
--- a/src/cascadia/TerminalSettingsEditor/MainPage.h
+++ b/src/cascadia/TerminalSettingsEditor/MainPage.h
@@ -68,6 +68,7 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         winrt::Microsoft::Terminal::Settings::Editor::ColorSchemesPageViewModel _colorSchemesPageVM{ nullptr };
 
         Windows::UI::Xaml::Data::INotifyPropertyChanged::PropertyChanged_revoker _profileViewModelChangedRevoker;
+        Windows::UI::Xaml::Data::INotifyPropertyChanged::PropertyChanged_revoker _colorSchemesPageViewModelChangedRevoker;
     };
 }
 
diff --git a/src/cascadia/TerminalSettingsEditor/MainPage.idl b/src/cascadia/TerminalSettingsEditor/MainPage.idl
index 2b724ab67b4..c9093bfe4fa 100644
--- a/src/cascadia/TerminalSettingsEditor/MainPage.idl
+++ b/src/cascadia/TerminalSettingsEditor/MainPage.idl
@@ -17,7 +17,8 @@ namespace Microsoft.Terminal.Settings.Editor
     {
         None = 0,
         Profile_Appearance,
-        Profile_Advanced
+        Profile_Advanced,
+        ColorSchemes_Edit
     };
 
     runtimeclass Breadcrumb
diff --git a/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj b/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj
index 213a5090c50..935ce529e39 100644
--- a/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj
+++ b/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj
@@ -61,6 +61,10 @@
       <DependentUpon>ColorSchemes.xaml</DependentUpon>
       <SubType>Code</SubType>
     </ClInclude>
+    <ClInclude Include="EditColorScheme.h">
+      <DependentUpon>EditColorScheme.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClInclude>
     <ClInclude Include="Interaction.h">
       <DependentUpon>Interaction.xaml</DependentUpon>
     </ClInclude>
@@ -148,6 +152,9 @@
     <Page Include="ColorSchemes.xaml">
       <SubType>Designer</SubType>
     </Page>
+    <Page Include="EditColorScheme.xaml">
+      <SubType>Designer</SubType>
+    </Page>
     <Page Include="Interaction.xaml">
       <SubType>Designer</SubType>
     </Page>
@@ -198,6 +205,10 @@
       <DependentUpon>ColorSchemes.xaml</DependentUpon>
       <SubType>Code</SubType>
     </ClCompile>
+    <ClCompile Include="EditColorScheme.cpp">
+      <DependentUpon>EditColorScheme.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </ClCompile>
     <ClCompile Include="Interaction.cpp">
       <DependentUpon>Interaction.xaml</DependentUpon>
     </ClCompile>
@@ -289,6 +300,10 @@
       <DependentUpon>ColorSchemes.xaml</DependentUpon>
       <SubType>Code</SubType>
     </Midl>
+    <Midl Include="EditColorScheme.idl">
+      <DependentUpon>EditColorScheme.xaml</DependentUpon>
+      <SubType>Code</SubType>
+    </Midl>
     <Midl Include="KeyChordListener.idl">
       <DependentUpon>KeyChordListener.xaml</DependentUpon>
       <SubType>Code</SubType>
diff --git a/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj.filters b/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj.filters
index 9e033097617..c999254e35f 100644
--- a/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj.filters
+++ b/src/cascadia/TerminalSettingsEditor/Microsoft.Terminal.Settings.Editor.vcxproj.filters
@@ -38,6 +38,7 @@
     <Page Include="CommonResources.xaml" />
     <Page Include="GlobalAppearance.xaml" />
     <Page Include="ColorSchemes.xaml" />
+    <Page Include="EditColorScheme.xaml" />
     <Page Include="Interaction.xaml" />
     <Page Include="Launch.xaml" />
     <Page Include="MainPage.xaml" />
diff --git a/src/cascadia/TerminalSettingsEditor/Resources/en-US/Resources.resw b/src/cascadia/TerminalSettingsEditor/Resources/en-US/Resources.resw
index 37f90414406..087eaba5f6e 100644
--- a/src/cascadia/TerminalSettingsEditor/Resources/en-US/Resources.resw
+++ b/src/cascadia/TerminalSettingsEditor/Resources/en-US/Resources.resw
@@ -135,6 +135,10 @@
     <value>Duplicate</value>
     <comment>Button label that duplicates the selected profile and navigates to the duplicate's page.</comment>
   </data>
+  <data name="ColorScheme_Rename.Header" xml:space="preserve">
+    <value>Rename color scheme</value>
+    <comment>This is the header for a control that allows the user to rename the currently selected color scheme.</comment>
+  </data>
   <data name="ColorScheme_Background.Text" xml:space="preserve">
     <value>Background</value>
     <comment>This is the header for a control that lets the user select the background color for text displayed on the screen.</comment>
@@ -1169,6 +1173,14 @@
     <value>Delete color scheme</value>
     <comment>Button label that deletes the selected color scheme.</comment>
   </data>
+  <data name="ColorScheme_EditButton.Text" xml:space="preserve">
+    <value>Edit</value>
+    <comment>Button label that edits the currently selected color scheme.</comment>
+  </data>
+  <data name="ColorScheme_DeleteButton2.Text" xml:space="preserve">
+    <value>Delete</value>
+    <comment>Button label that deletes the selected color scheme.</comment>
+  </data>
   <data name="ColorScheme_Name.Header" xml:space="preserve">
     <value>Name</value>
     <comment>The name of the color scheme. Used as a label on the name control.</comment>
@@ -1345,6 +1357,10 @@
     <value>System colors</value>
     <comment>A header for a grouping of colors in the color scheme. These colors are used for functional parts of the terminal.</comment>
   </data>
+  <data name="ColorScheme_ColorsHeader.Header" xml:space="preserve">
+    <value>Colors</value>
+    <comment>A header for the grouping of colors in the color scheme.</comment>
+  </data>
   <data name="SettingContainer_OverrideMessageFragmentExtension" xml:space="preserve">
     <value>Reset to value from: {}</value>
     <comment>{} is replaced by the name of another profile or generator. This is a text label on a button that is dynamically generated and provides more context in the {}.</comment>
@@ -1473,4 +1489,20 @@
     <value>If enabled, the window will be hidden as soon as it loses focus.</value>
     <comment>A description for what the "Automatically hide window" setting does.</comment>
   </data>
-</root>
+  <data name="ColorScheme_DeleteDisclaimerInBox" xml:space="preserve">
+    <value>This color scheme cannot be deleted because it is included by default.</value>
+    <comment>Disclaimer presented near the controls to delete the selected color scheme when that functionality is disabled.</comment>
+  </data>
+  <data name="ColorScheme_RenameDisclaimerInBox" xml:space="preserve">
+    <value>This color scheme cannot be renamed because it is included by default.</value>
+    <comment>Disclaimer presented near the controls to rename the color scheme when that functionality is disabled.</comment>
+  </data>
+  <data name="ColorScheme_DefaultTag.Text" xml:space="preserve">
+    <value>default</value>
+    <comment>Text label displayed adjacent to a "color scheme" entry signifying that it is currently set as the default color scheme to be used.</comment>
+  </data>
+  <data name="ColorScheme_SetAsDefaultButton.Content" xml:space="preserve">
+    <value>Set as default</value>
+    <comment>Text label for a button that, when invoked, sets the selected color scheme as the default scheme to use.</comment>
+  </data>
+</root>
\ No newline at end of file
diff --git a/src/cascadia/TerminalSettingsEditor/SettingContainer.cpp b/src/cascadia/TerminalSettingsEditor/SettingContainer.cpp
index 11ee518458a..50a06792fef 100644
--- a/src/cascadia/TerminalSettingsEditor/SettingContainer.cpp
+++ b/src/cascadia/TerminalSettingsEditor/SettingContainer.cpp
@@ -15,6 +15,7 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
     DependencyProperty SettingContainer::_CurrentValueProperty{ nullptr };
     DependencyProperty SettingContainer::_HasSettingValueProperty{ nullptr };
     DependencyProperty SettingContainer::_SettingOverrideSourceProperty{ nullptr };
+    DependencyProperty SettingContainer::_StartExpandedProperty{ nullptr };
 
     SettingContainer::SettingContainer()
     {
@@ -71,6 +72,15 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
                     xaml_typename<Editor::SettingContainer>(),
                     PropertyMetadata{ nullptr, PropertyChangedCallback{ &SettingContainer::_OnHasSettingValueChanged } });
         }
+        if (!_StartExpandedProperty)
+        {
+            _StartExpandedProperty =
+                DependencyProperty::Register(
+                    L"StartExpanded",
+                    xaml_typename<bool>(),
+                    xaml_typename<Editor::SettingContainer>(),
+                    PropertyMetadata{ box_value(false) });
+        }
     }
 
     void SettingContainer::_OnHasSettingValueChanged(const DependencyObject& d, const DependencyPropertyChangedEventArgs& /*args*/)
@@ -156,16 +166,19 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
                 Controls::ToolTipService::SetToolTip(base, box_value(helpText));
                 Automation::AutomationProperties::SetFullDescription(base, helpText);
             }
+            else
+            {
+                Controls::ToolTipService::SetToolTip(base, nullptr);
+                Automation::AutomationProperties::SetFullDescription(base, L"");
+            }
         }
 
-        if (HelpText().empty())
+        const auto textBlockHidden = HelpText().empty();
+        if (const auto& child{ GetTemplateChild(L"HelpTextBlock") })
         {
-            if (const auto& child{ GetTemplateChild(L"HelpTextBlock") })
+            if (const auto& textBlock{ child.try_as<Controls::TextBlock>() })
             {
-                if (const auto& textBlock{ child.try_as<Controls::TextBlock>() })
-                {
-                    textBlock.Visibility(Visibility::Collapsed);
-                }
+                textBlock.Visibility(textBlockHidden ? Visibility::Collapsed : Visibility::Visible);
             }
         }
     }
diff --git a/src/cascadia/TerminalSettingsEditor/SettingContainer.h b/src/cascadia/TerminalSettingsEditor/SettingContainer.h
index da25e1f2df3..5b48b438f51 100644
--- a/src/cascadia/TerminalSettingsEditor/SettingContainer.h
+++ b/src/cascadia/TerminalSettingsEditor/SettingContainer.h
@@ -33,6 +33,7 @@ namespace winrt::Microsoft::Terminal::Settings::Editor::implementation
         DEPENDENCY_PROPERTY(hstring, HelpText);
         DEPENDENCY_PROPERTY(hstring, CurrentValue);
         DEPENDENCY_PROPERTY(bool, HasSettingValue);
+        DEPENDENCY_PROPERTY(bool, StartExpanded);
         DEPENDENCY_PROPERTY(IInspectable, SettingOverrideSource);
         TYPED_EVENT(ClearSettingValue, Editor::SettingContainer, Windows::Foundation::IInspectable);
 
diff --git a/src/cascadia/TerminalSettingsEditor/SettingContainer.idl b/src/cascadia/TerminalSettingsEditor/SettingContainer.idl
index 39638ca4fe8..1148e0eb6d9 100644
--- a/src/cascadia/TerminalSettingsEditor/SettingContainer.idl
+++ b/src/cascadia/TerminalSettingsEditor/SettingContainer.idl
@@ -22,6 +22,9 @@ namespace Microsoft.Terminal.Settings.Editor
         IInspectable SettingOverrideSource;
         static Windows.UI.Xaml.DependencyProperty SettingOverrideSourceProperty { get; };
 
+        Boolean StartExpanded;
+        static Windows.UI.Xaml.DependencyProperty StartExpandedProperty { get; };
+
         event Windows.Foundation.TypedEventHandler<SettingContainer, Object> ClearSettingValue;
     };
 }
diff --git a/src/cascadia/TerminalSettingsEditor/SettingContainerStyle.xaml b/src/cascadia/TerminalSettingsEditor/SettingContainerStyle.xaml
index 6552bc19872..5efeceeaece 100644
--- a/src/cascadia/TerminalSettingsEditor/SettingContainerStyle.xaml
+++ b/src/cascadia/TerminalSettingsEditor/SettingContainerStyle.xaml
@@ -146,7 +146,8 @@
                                    Margin="0,4,0,0"
                                    HorizontalAlignment="Stretch"
                                    HorizontalContentAlignment="Stretch"
-                                   Content="{TemplateBinding Content}">
+                                   Content="{TemplateBinding Content}"
+                                   IsExpanded="{TemplateBinding StartExpanded}">
                         <muxc:Expander.Header>
                             <Grid MinHeight="64">
                                 <Grid.ColumnDefinitions>


Test patch: