diff --git a/src/cascadia/TerminalControl/TSFInputControl.cpp b/src/cascadia/TerminalControl/TSFInputControl.cpp
index 2e020f1c937..a51969f2d11 100644
--- a/src/cascadia/TerminalControl/TSFInputControl.cpp
+++ b/src/cascadia/TerminalControl/TSFInputControl.cpp
@@ -20,33 +20,7 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
         _editContext{ nullptr },
         _inComposition{ false }
     {
-        _Create();
-    }
-
-    // Method Description:
-    // - Creates XAML controls for displaying user input and hooks up CoreTextEditContext handlers
-    //   for handling text input from the Text Services Framework.
-    // Arguments:
-    // - <none>
-    // Return Value:
-    // - <none>
-    void TSFInputControl::_Create()
-    {
-        // TextBlock for user input form TSF
-        _textBlock = Controls::TextBlock();
-        _textBlock.Visibility(Visibility::Collapsed);
-        _textBlock.IsTextSelectionEnabled(false);
-        _textBlock.TextDecorations(TextDecorations::Underline);
-
-        // Canvas for controlling exact position of the TextBlock
-        _canvas = Windows::UI::Xaml::Controls::Canvas();
-        _canvas.Visibility(Visibility::Collapsed);
-
-        // add the Textblock to the Canvas
-        _canvas.Children().Append(_textBlock);
-
-        // set the content of this control to be the Canvas
-        this->Content(_canvas);
+        InitializeComponent();
 
         // Create a CoreTextEditingContext for since we are acting like a custom edit control
         auto manager = Core::CoreTextServicesManager::GetForCurrentView();
@@ -177,15 +151,15 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
         request.LayoutBounds().ControlBounds(ScaleRect(controlRect, scaleFactor));
 
         // position textblock to cursor position
-        _canvas.SetLeft(_textBlock, clientCursorPos.X);
-        _canvas.SetTop(_textBlock, ::base::ClampedNumeric<double>(clientCursorPos.Y));
+        Canvas().SetLeft(TextBlock(), clientCursorPos.X);
+        Canvas().SetTop(TextBlock(), ::base::ClampedNumeric<double>(clientCursorPos.Y));
 
-        _textBlock.Height(fontHeight);
+        TextBlock().Height(fontHeight);
         // calculate FontSize in pixels from DIPs
         const double fontSizePx = (fontHeight * 72) / USER_DEFAULT_SCREEN_DPI;
-        _textBlock.FontSize(fontSizePx);
+        TextBlock().FontSize(fontSizePx);
 
-        _textBlock.FontFamily(Media::FontFamily(fontArgs->FontFace()));
+        TextBlock().FontFamily(Media::FontFamily(fontArgs->FontFace()));
     }
 
     // Method Description:
@@ -302,8 +276,7 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
 
         try
         {
-            _canvas.Visibility(Visibility::Visible);
-            _textBlock.Visibility(Visibility::Visible);
+            Canvas().Visibility(Visibility::Visible);
 
             const auto length = ::base::ClampSub<size_t>(range.EndCaretPosition, range.StartCaretPosition);
             _inputBuffer = _inputBuffer.replace(
@@ -311,7 +284,7 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
                 length,
                 text);
 
-            _textBlock.Text(_inputBuffer);
+            TextBlock().Text(_inputBuffer);
 
             // If we receive tabbed IME input like emoji, kaomojis, and symbols, send it to the terminal immediately.
             // They aren't composition, so we don't want to wait for the user to start and finish a composition to send the text.
@@ -348,7 +321,7 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
         // clear the buffer for next round
         const auto bufferLength = ::base::ClampedNumeric<int32_t>(_inputBuffer.length());
         _inputBuffer.clear();
-        _textBlock.Text(L"");
+        TextBlock().Text(L"");
 
         // Leaving focus before NotifyTextChanged seems to guarantee that the next
         // composition will send us a CompositionStarted event.
@@ -357,8 +330,7 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
         _editContext.NotifyFocusEnter();
 
         // hide the controls until text input starts again
-        _canvas.Visibility(Visibility::Collapsed);
-        _textBlock.Visibility(Visibility::Collapsed);
+        Canvas().Visibility(Visibility::Collapsed);
     }
 
     // Method Description:
diff --git a/src/cascadia/TerminalControl/TSFInputControl.h b/src/cascadia/TerminalControl/TSFInputControl.h
index 8438d37bbbc..f463444c0e8 100644
--- a/src/cascadia/TerminalControl/TSFInputControl.h
+++ b/src/cascadia/TerminalControl/TSFInputControl.h
@@ -67,15 +67,10 @@ namespace winrt::Microsoft::Terminal::TerminalControl::implementation
         winrt::Windows::UI::Text::Core::CoreTextEditContext::CompositionStarted_revoker _compositionStartedRevoker;
         winrt::Windows::UI::Text::Core::CoreTextEditContext::CompositionCompleted_revoker _compositionCompletedRevoker;
 
-        Windows::UI::Xaml::Controls::Canvas _canvas;
-        Windows::UI::Xaml::Controls::TextBlock _textBlock;
-
         Windows::UI::Text::Core::CoreTextEditContext _editContext;
 
         std::wstring _inputBuffer;
 
-        void _Create();
-
         bool _inComposition;
         void _SendAndClearText();
     };
diff --git a/src/cascadia/TerminalControl/TSFInputControl.xaml b/src/cascadia/TerminalControl/TSFInputControl.xaml
new file mode 100644
index 00000000000..50c87a6e538
--- /dev/null
+++ b/src/cascadia/TerminalControl/TSFInputControl.xaml
@@ -0,0 +1,16 @@
+<UserControl
+    x:Class="Microsoft.Terminal.TerminalControl.TSFInputControl"
+    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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+    mc:Ignorable="d"
+    d:DesignHeight="768"
+    d:DesignWidth="1024">
+
+    <Canvas x:Name="Canvas" Visibility="Collapsed">
+        <TextBlock x:Name="TextBlock"
+                   IsTextSelectionEnabled="false"
+                   TextDecorations="Underline" />
+    </Canvas>
+</UserControl>
diff --git a/src/cascadia/TerminalControl/TerminalControl.vcxproj b/src/cascadia/TerminalControl/TerminalControl.vcxproj
index 2ae8ea7e4c5..e057d90bd2d 100644
--- a/src/cascadia/TerminalControl/TerminalControl.vcxproj
+++ b/src/cascadia/TerminalControl/TerminalControl.vcxproj
@@ -43,7 +43,7 @@
       <DependentUpon>TermControlAutomationPeer.idl</DependentUpon>
     </ClInclude>
     <ClInclude Include="TSFInputControl.h">
-      <DependentUpon>TSFInputControl.idl</DependentUpon>
+      <DependentUpon>TSFInputControl.xaml</DependentUpon>
     </ClInclude>
     <ClInclude Include="XamlUiaTextRange.h" />
   </ItemGroup>
@@ -59,7 +59,7 @@
       <DependentUpon>TermControl.xaml</DependentUpon>
     </ClCompile>
     <ClCompile Include="TSFInputControl.cpp">
-      <DependentUpon>TSFInputControl.idl</DependentUpon>
+      <DependentUpon>TSFInputControl.xaml</DependentUpon>
     </ClCompile>
     <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
     <ClCompile Include="TermControlAutomationPeer.cpp">
@@ -75,7 +75,9 @@
       <DependentUpon>TermControl.xaml</DependentUpon>
     </Midl>
     <Midl Include="TermControlAutomationPeer.idl" />
-    <Midl Include="TSFInputControl.idl" />
+    <Midl Include="TSFInputControl.idl">
+      <DependentUpon>TSFInputControl.xaml</DependentUpon>
+    </Midl>
   </ItemGroup>
   <ItemGroup>
     <None Include="packages.config" />
@@ -114,6 +116,9 @@
     <Page Include="TermControl.xaml">
       <SubType>Designer</SubType>
     </Page>
+    <Page Include="TSFInputControl.xaml">
+      <SubType>Designer</SubType>
+    </Page>
   </ItemGroup>
 
   <Import Project="$(OpenConsoleDir)src\cppwinrt.build.post.props" />