diff --git a/site/src/modules/dashboard/DashboardLayout.tsx b/site/src/modules/dashboard/DashboardLayout.tsx
index df3478ab18394..21fc29859f0ea 100644
--- a/site/src/modules/dashboard/DashboardLayout.tsx
+++ b/site/src/modules/dashboard/DashboardLayout.tsx
@@ -1,9 +1,9 @@
-import InfoOutlined from "@mui/icons-material/InfoOutlined";
 import Link from "@mui/material/Link";
 import Snackbar from "@mui/material/Snackbar";
 import { Button } from "components/Button/Button";
 import { Loader } from "components/Loader/Loader";
 import { useAuthenticated } from "hooks";
+import { InfoIcon } from "lucide-react";
 import { AnnouncementBanners } from "modules/dashboard/AnnouncementBanners/AnnouncementBanners";
 import { LicenseBanner } from "modules/dashboard/LicenseBanner/LicenseBanner";
 import { type FC, type HTMLAttributes, Suspense } from "react";
@@ -74,7 +74,8 @@ export const DashboardLayout: FC = () => {
 					}}
 					message={
 						<div css={{ display: "flex", gap: 16 }}>
-							<InfoOutlined
+							<InfoIcon
+								className="size-icon-xs"
 								css={(theme) => ({
 									fontSize: 16,
 									height: 20, // 20 is the height of the text line so we can align them
diff --git a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx
index 13bdaafef4a70..2fb5fdd819a03 100644
--- a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx
+++ b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx
@@ -1,10 +1,5 @@
 import type { CSSInterpolation } from "@emotion/css/dist/declarations/src/create-instance";
 import { type Interpolation, type Theme, css, useTheme } from "@emotion/react";
-import DownloadIcon from "@mui/icons-material/CloudDownload";
-import UploadIcon from "@mui/icons-material/CloudUpload";
-import CollectedIcon from "@mui/icons-material/Compare";
-import LatencyIcon from "@mui/icons-material/SettingsEthernet";
-import WebTerminalIcon from "@mui/icons-material/WebAsset";
 import Button from "@mui/material/Button";
 import Link from "@mui/material/Link";
 import Tooltip from "@mui/material/Tooltip";
@@ -21,6 +16,11 @@ import { VSCodeIcon } from "components/Icons/VSCodeIcon";
 import { Stack } from "components/Stack/Stack";
 import dayjs from "dayjs";
 import { type ClassName, useClassName } from "hooks/useClassName";
+import { CloudDownloadIcon } from "lucide-react";
+import { CloudUploadIcon } from "lucide-react";
+import { GitCompareArrowsIcon } from "lucide-react";
+import { GaugeIcon } from "lucide-react";
+import { AppWindowIcon } from "lucide-react";
 import { RotateCwIcon, WrenchIcon } from "lucide-react";
 import { CircleAlertIcon } from "lucide-react";
 import prettyBytes from "pretty-bytes";
@@ -197,14 +197,14 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
 				<div css={styles.values}>
 					<Tooltip title="Data sent to workspaces">
 						<div css={styles.value}>
-							<DownloadIcon />
+							<CloudDownloadIcon className="size-icon-xs" />
 							{stats ? prettyBytes(stats.workspaces.rx_bytes) : "-"}
 						</div>
 					</Tooltip>
 					<ValueSeparator />
 					<Tooltip title="Data sent from workspaces">
 						<div css={styles.value}>
-							<UploadIcon />
+							<CloudUploadIcon className="size-icon-xs" />
 							{stats ? prettyBytes(stats.workspaces.tx_bytes) : "-"}
 						</div>
 					</Tooltip>
@@ -217,7 +217,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
 						}
 					>
 						<div css={styles.value}>
-							<LatencyIcon />
+							<GaugeIcon className="size-icon-xs" />
 							{displayLatency > 0 ? `${displayLatency?.toFixed(2)} ms` : "-"}
 						</div>
 					</Tooltip>
@@ -269,7 +269,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
 					<ValueSeparator />
 					<Tooltip title="Web Terminal Sessions">
 						<div css={styles.value}>
-							<WebTerminalIcon />
+							<AppWindowIcon className="size-icon-xs" />
 							{typeof stats?.session_count.reconnecting_pty === "undefined"
 								? "-"
 								: stats?.session_count.reconnecting_pty}
@@ -289,7 +289,7 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
 			>
 				<Tooltip title="The last time stats were aggregated. Workspaces report statistics periodically, so it may take a bit for these to update!">
 					<div css={styles.value}>
-						<CollectedIcon />
+						<GitCompareArrowsIcon className="size-icon-xs" />
 						{lastAggregated}
 					</div>
 				</Tooltip>
diff --git a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
index 9117b7aade6e5..412df60d9203e 100644
--- a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
+++ b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
@@ -4,7 +4,6 @@ import AppsIcon from "@mui/icons-material/Apps";
 import CheckCircle from "@mui/icons-material/CheckCircle";
 import ErrorIcon from "@mui/icons-material/Error";
 import InsertDriveFile from "@mui/icons-material/InsertDriveFile";
-import OpenInNew from "@mui/icons-material/OpenInNew";
 import Warning from "@mui/icons-material/Warning";
 import CircularProgress from "@mui/material/CircularProgress";
 import type {
@@ -13,6 +12,7 @@ import type {
 	WorkspaceAgent,
 	WorkspaceApp,
 } from "api/typesGenerated";
+import { ExternalLinkIcon } from "lucide-react";
 import { useAppLink } from "modules/apps/useAppLink";
 import type { FC } from "react";
 
@@ -186,13 +186,12 @@ export const WorkspaceAppStatus = ({
 										},
 									}}
 								>
-									<OpenInNew
-										sx={{
-											fontSize: 11,
+									<ExternalLinkIcon
+										className="size-icon-xs"
+										css={{
 											opacity: 0.7,
-											mt: -0.125,
 											flexShrink: 0,
-											mr: 0.5,
+											marginRight: 2,
 										}}
 									/>
 									<span
diff --git a/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx b/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx
index eed553b588ec6..b79183acd7471 100644
--- a/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx
+++ b/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx
@@ -1,5 +1,4 @@
 import { type Interpolation, type Theme, useTheme } from "@emotion/react";
-import InfoIcon from "@mui/icons-material/InfoOutlined";
 import Link from "@mui/material/Link";
 import Skeleton from "@mui/material/Skeleton";
 import { getErrorDetail, getErrorMessage } from "api/errors";
@@ -16,6 +15,7 @@ import {
 	HelpTooltipTrigger,
 } from "components/HelpTooltip/HelpTooltip";
 import { usePopover } from "components/deprecated/Popover/Popover";
+import { InfoIcon } from "lucide-react";
 import { RotateCcwIcon } from "lucide-react";
 import { linkToTemplate, useLinks } from "modules/navigation";
 import type { FC } from "react";
diff --git a/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx b/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
index cfb4285f77eda..6bf18b084b02b 100644
--- a/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
+++ b/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
@@ -1,7 +1,7 @@
 import type { Interpolation, Theme } from "@emotion/react";
 import ErrorSharp from "@mui/icons-material/ErrorSharp";
-import InfoOutlined from "@mui/icons-material/InfoOutlined";
 import type { TimingStage } from "api/typesGenerated";
+import { InfoIcon } from "lucide-react";
 import type { FC } from "react";
 import { Bar, ClickableBar } from "./Chart/Bar";
 import { Blocks } from "./Chart/Blocks";
@@ -107,7 +107,10 @@ export const StagesChart: FC<StagesChartProps> = ({
 											<span css={styles.stageLabel}>
 												{stage.label}
 												<Tooltip {...stage.tooltip}>
-													<InfoOutlined css={styles.info} />
+													<InfoIcon
+														className="size-icon-xs"
+														css={styles.info}
+													/>
 												</Tooltip>
 											</span>
 										</YAxisLabel>
diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx
index ebd79c0ba9abf..87b303f6014ef 100644
--- a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx
+++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx
@@ -1,5 +1,4 @@
 import type { CSSObject, Interpolation, Theme } from "@emotion/react";
-import InfoOutlined from "@mui/icons-material/InfoOutlined";
 import Collapse from "@mui/material/Collapse";
 import Link from "@mui/material/Link";
 import TableCell from "@mui/material/TableCell";
@@ -10,6 +9,7 @@ import { DropdownArrow } from "components/DropdownArrow/DropdownArrow";
 import { Pill } from "components/Pill/Pill";
 import { Stack } from "components/Stack/Stack";
 import { TimelineEntry } from "components/Timeline/TimelineEntry";
+import { InfoIcon } from "lucide-react";
 import { NetworkIcon } from "lucide-react";
 import { type FC, useState } from "react";
 import { Link as RouterLink } from "react-router-dom";
@@ -191,9 +191,8 @@ export const AuditLogRow: FC<AuditLogRowProps> = ({
 												</div>
 											}
 										>
-											<InfoOutlined
+											<InfoIcon
 												css={(theme) => ({
-													fontSize: 20,
 													color: theme.palette.info.light,
 												})}
 											/>