diff --git a/site/package.json b/site/package.json
index 8f7f8f4f7c44a..c7a26c7af378c 100644
--- a/site/package.json
+++ b/site/package.json
@@ -32,9 +32,9 @@
   "dependencies": {
     "@emoji-mart/data": "1.0.5",
     "@emoji-mart/react": "1.0.1",
-    "@fastly/performance-observer-polyfill": "2.0.0",
     "@emotion/react": "11.10.8",
     "@emotion/styled": "11.11.0",
+    "@fastly/performance-observer-polyfill": "2.0.0",
     "@fontsource/ibm-plex-mono": "4.5.10",
     "@fontsource/inter": "5.0.2",
     "@monaco-editor/react": "4.5.0",
@@ -94,6 +94,7 @@
     "vite": "4.3.9",
     "xstate": "4.37.2",
     "xterm": "5.1.0",
+    "xterm-addon-canvas": "0.4.0",
     "xterm-addon-fit": "0.7.0",
     "xterm-addon-web-links": "0.8.0",
     "yup": "0.32.11"
diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
index 1a8fa700ae77c..fd69971f09b36 100644
--- a/site/src/AppRouter.tsx
+++ b/site/src/AppRouter.tsx
@@ -317,7 +317,7 @@ export const AppRouter: FC = () => {
             {/* Terminal and CLI auth pages don't have the dashboard layout */}
             <Route
               path="/:username/:workspace/terminal"
-              element={<TerminalPage />}
+              element={<TerminalPage renderer="canvas" />}
             />
             <Route path="cli-auth" element={<CliAuthenticationPage />} />
           </Route>
diff --git a/site/src/pages/TerminalPage/TerminalPage.test.tsx b/site/src/pages/TerminalPage/TerminalPage.test.tsx
index 45675ae547db5..6412efaaa519a 100644
--- a/site/src/pages/TerminalPage/TerminalPage.test.tsx
+++ b/site/src/pages/TerminalPage/TerminalPage.test.tsx
@@ -38,7 +38,7 @@ Object.defineProperty(window, "TextEncoder", {
 const renderTerminal = async (
   route = `/${MockUser.username}/${MockWorkspace.name}/terminal`,
 ) => {
-  const utils = renderWithAuth(<TerminalPage />, {
+  const utils = renderWithAuth(<TerminalPage renderer="dom" />, {
     route,
     path: "/:username/:workspace/terminal",
   })
diff --git a/site/src/pages/TerminalPage/TerminalPage.tsx b/site/src/pages/TerminalPage/TerminalPage.tsx
index cec22093632d7..09fc1a0633511 100644
--- a/site/src/pages/TerminalPage/TerminalPage.tsx
+++ b/site/src/pages/TerminalPage/TerminalPage.tsx
@@ -8,6 +8,7 @@ import { useNavigate, useParams, useSearchParams } from "react-router-dom"
 import { colors } from "theme/colors"
 import { v4 as uuidv4 } from "uuid"
 import * as XTerm from "xterm"
+import { CanvasAddon } from "xterm-addon-canvas"
 import { FitAddon } from "xterm-addon-fit"
 import { WebLinksAddon } from "xterm-addon-web-links"
 import "xterm/css/xterm.css"
@@ -69,7 +70,11 @@ const useTerminalWarning = ({
   }
 }
 
-const TerminalPage: FC = () => {
+type TerminalPageProps = React.PropsWithChildren<{
+  renderer: "canvas" | "dom"
+}>
+
+const TerminalPage: FC<TerminalPageProps> = ({ renderer }) => {
   const navigate = useNavigate()
   const styles = useStyles()
   const { proxy } = useProxy()
@@ -194,6 +199,10 @@ const TerminalPage: FC = () => {
         background: colors.gray[16],
       },
     })
+    // DOM is the default renderer.
+    if (renderer === "canvas") {
+      terminal.loadAddon(new CanvasAddon())
+    }
     const fitAddon = new FitAddon()
     setFitAddon(fitAddon)
     terminal.loadAddon(fitAddon)
@@ -230,7 +239,7 @@ const TerminalPage: FC = () => {
       window.removeEventListener("resize", listener)
       terminal.dispose()
     }
-  }, [sendEvent, xtermRef, handleWebLink])
+  }, [renderer, sendEvent, xtermRef, handleWebLink])
 
   // Triggers the initial terminal connection using
   // the reconnection token and workspace name found
diff --git a/site/yarn.lock b/site/yarn.lock
index 740ebb2dd4cfb..7f3bde87749c5 100644
--- a/site/yarn.lock
+++ b/site/yarn.lock
@@ -12043,6 +12043,11 @@ xtend@^4.0.0, xtend@~4.0.1:
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
   integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
 
+xterm-addon-canvas@0.4.0:
+  version "0.4.0"
+  resolved "https://registry.yarnpkg.com/xterm-addon-canvas/-/xterm-addon-canvas-0.4.0.tgz#a6ee6a56deb0c495fcef29afe6d94b7119a0f334"
+  integrity sha512-iTC8CdjX9+hGX7jiEuiDMXzHsY/FKJdVnbjep5xjRXNu7RKOk15xuecIkJ7HZORqMVPpr4DGS3jyd9XUoBuxqw==
+
 xterm-addon-fit@0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/xterm-addon-fit/-/xterm-addon-fit-0.7.0.tgz#b8ade6d96e63b47443862088f6670b49fb752c6a"