diff --git a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
index 412df60d9203e..95123ce8734df 100644
--- a/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
+++ b/site/src/modules/workspaces/WorkspaceAppStatus/WorkspaceAppStatus.tsx
@@ -1,10 +1,7 @@
 import type { Theme } from "@emotion/react";
 import { useTheme } from "@emotion/react";
 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 Warning from "@mui/icons-material/Warning";
 import CircularProgress from "@mui/material/CircularProgress";
 import type {
 	WorkspaceAppStatus as APIWorkspaceAppStatus,
@@ -12,6 +9,9 @@ import type {
 	WorkspaceAgent,
 	WorkspaceApp,
 } from "api/typesGenerated";
+import { CircleCheckIcon } from "lucide-react";
+import { CircleAlertIcon } from "lucide-react";
+import { TriangleAlertIcon } from "lucide-react";
 import { ExternalLinkIcon } from "lucide-react";
 import { useAppLink } from "modules/apps/useAppLink";
 import type { FC } from "react";
@@ -46,13 +46,13 @@ const getStatusIcon = (theme: Theme, state: APIWorkspaceAppStatus["state"]) => {
 	const color = getStatusColor(theme, state);
 	switch (state) {
 		case "complete":
-			return <CheckCircle sx={{ color, fontSize: 16 }} />;
+			return <CircleCheckIcon className="size-icon-xs" style={{ color }} />;
 		case "failure":
-			return <ErrorIcon sx={{ color, fontSize: 16 }} />;
+			return <CircleAlertIcon className="size-icon-xs" style={{ color }} />;
 		case "working":
 			return <CircularProgress size={16} sx={{ color }} />;
 		default:
-			return <Warning sx={{ color, fontSize: 16 }} />;
+			return <TriangleAlertIcon className="size-icon-xs" style={{ color }} />;
 	}
 };
 
diff --git a/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx b/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
index 6bf18b084b02b..6ca814bb39afd 100644
--- a/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
+++ b/site/src/modules/workspaces/WorkspaceTiming/StagesChart.tsx
@@ -1,6 +1,6 @@
 import type { Interpolation, Theme } from "@emotion/react";
-import ErrorSharp from "@mui/icons-material/ErrorSharp";
 import type { TimingStage } from "api/typesGenerated";
+import { CircleAlertIcon } from "lucide-react";
 import { InfoIcon } from "lucide-react";
 import type { FC } from "react";
 import { Bar, ClickableBar } from "./Chart/Bar";
@@ -159,9 +159,9 @@ export const StagesChart: FC<StagesChartProps> = ({
 													}}
 												>
 													{t.error && (
-														<ErrorSharp
+														<CircleAlertIcon
+															className="size-icon-sm"
 															css={{
-																fontSize: 18,
 																color: "#F87171",
 																marginRight: 4,
 															}}
diff --git a/site/src/pages/ChatPage/ChatToolInvocation.tsx b/site/src/pages/ChatPage/ChatToolInvocation.tsx
index 6f418edabb4a5..5f6345fdf1f25 100644
--- a/site/src/pages/ChatPage/ChatToolInvocation.tsx
+++ b/site/src/pages/ChatPage/ChatToolInvocation.tsx
@@ -2,10 +2,8 @@ import type { ToolCall, ToolResult } from "@ai-sdk/provider-utils";
 import { useTheme } from "@emotion/react";
 import ArticleIcon from "@mui/icons-material/Article";
 import BuildIcon from "@mui/icons-material/Build";
-import CheckCircle from "@mui/icons-material/CheckCircle";
 import CodeIcon from "@mui/icons-material/Code";
 import DeleteIcon from "@mui/icons-material/Delete";
-import ErrorIcon from "@mui/icons-material/Error";
 import FileUploadIcon from "@mui/icons-material/FileUpload";
 import PersonIcon from "@mui/icons-material/Person";
 import SettingsIcon from "@mui/icons-material/Settings";
@@ -13,6 +11,8 @@ import CircularProgress from "@mui/material/CircularProgress";
 import Tooltip from "@mui/material/Tooltip";
 import type * as TypesGen from "api/typesGenerated";
 import { Avatar } from "components/Avatar/Avatar";
+import { CircleCheckIcon } from "lucide-react";
+import { CircleAlertIcon } from "lucide-react";
 import { InfoIcon } from "lucide-react";
 import type React from "react";
 import { type FC, memo, useMemo, useState } from "react";
@@ -96,9 +96,15 @@ export const ChatToolInvocation: FC<ChatToolInvocationProps> = ({
 				)}
 				{toolInvocation.state === "result" ? (
 					hasError ? (
-						<ErrorIcon sx={{ color: statusColor, fontSize: 16 }} />
+						<CircleAlertIcon
+							className="size-icon-xs"
+							style={{ color: statusColor }}
+						/>
 					) : (
-						<CheckCircle sx={{ color: statusColor, fontSize: 16 }} />
+						<CircleCheckIcon
+							className="size-icon-xs"
+							style={{ color: statusColor }}
+						/>
 					)
 				) : null}
 				<div
diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx
index c7da8332a29ab..7f3b11a4069ad 100644
--- a/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx
+++ b/site/src/pages/TemplatePage/TemplateInsightsPage/IntervalMenu.tsx
@@ -1,7 +1,7 @@
-import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
 import Menu from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
 import { Button } from "components/Button/Button";
+import { ChevronDownIcon } from "lucide-react";
 import { CheckIcon } from "lucide-react";
 import { type FC, useRef, useState } from "react";
 
@@ -41,7 +41,7 @@ export const IntervalMenu: FC<IntervalMenuProps> = ({ value, onChange }) => {
 				variant="outline"
 			>
 				{insightsIntervals[value].label}
-				<ExpandMoreOutlined className="size-icon-xs ml-1" />
+				<ChevronDownIcon className="size-icon-xs ml-1" />
 			</Button>
 			<Menu
 				id="interval-menu"
diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx
index 36b6fb65e7e9f..f180dc2545a51 100644
--- a/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx
+++ b/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx
@@ -1,8 +1,8 @@
-import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
 import Button from "@mui/material/Button";
 import Menu from "@mui/material/Menu";
 import MenuItem from "@mui/material/MenuItem";
 import { differenceInWeeks } from "date-fns";
+import { ChevronDownIcon } from "lucide-react";
 import { CheckIcon } from "lucide-react";
 import { type FC, useRef, useState } from "react";
 import type { DateRangeValue } from "./DateRange";
@@ -35,7 +35,7 @@ export const WeekPicker: FC<WeekPickerProps> = ({ value, onChange }) => {
 				aria-haspopup="true"
 				aria-expanded={open ? "true" : undefined}
 				onClick={() => setOpen(true)}
-				endIcon={<ExpandMoreOutlined />}
+				endIcon={<ChevronDownIcon className="size-icon-xs" />}
 			>
 				Last {numberOfWeeks} weeks
 			</Button>
diff --git a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx
index 2d76db8f9243d..bb0e3f439ed49 100644
--- a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx
+++ b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx
@@ -1,4 +1,3 @@
-import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined";
 import Link from "@mui/material/Link";
 import useTheme from "@mui/system/useTheme";
 import type { ProvisionerDaemon } from "api/typesGenerated";
@@ -9,6 +8,7 @@ import {
 	PopoverContent,
 	PopoverTrigger,
 } from "components/deprecated/Popover/Popover";
+import { ChevronDownIcon } from "lucide-react";
 import { ProvisionerTagsField } from "modules/provisioners/ProvisionerTagsField";
 import type { FC } from "react";
 import { docs } from "utils/docs";
@@ -31,7 +31,7 @@ export const ProvisionerTagsPopover: FC<ProvisionerTagsPopoverProps> = ({
 					color="neutral"
 					css={{ paddingLeft: 0, paddingRight: 0, minWidth: "28px !important" }}
 				>
-					<ExpandMoreOutlined css={{ fontSize: 14 }} />
+					<ChevronDownIcon className="size-icon-xs" />
 					<span className="sr-only">Expand provisioner tags</span>
 				</TopbarButton>
 			</PopoverTrigger>
diff --git a/site/src/pages/WorkspacePage/AppStatuses.tsx b/site/src/pages/WorkspacePage/AppStatuses.tsx
index 60e4a8cecf22e..22dc5257f0e00 100644
--- a/site/src/pages/WorkspacePage/AppStatuses.tsx
+++ b/site/src/pages/WorkspacePage/AppStatuses.tsx
@@ -1,10 +1,7 @@
 import type { Theme } from "@emotion/react";
 import { useTheme } from "@emotion/react";
 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 Warning from "@mui/icons-material/Warning";
 import CircularProgress from "@mui/material/CircularProgress";
 import Link from "@mui/material/Link";
 import Tooltip from "@mui/material/Tooltip";
@@ -15,6 +12,9 @@ import type {
 	WorkspaceApp,
 } from "api/typesGenerated";
 import { formatDistance, formatDistanceToNow } from "date-fns";
+import { CircleCheckIcon } from "lucide-react";
+import { CircleAlertIcon } from "lucide-react";
+import { TriangleAlertIcon } from "lucide-react";
 import { ExternalLinkIcon } from "lucide-react";
 import { HourglassIcon } from "lucide-react";
 import { CircleHelpIcon } from "lucide-react";
@@ -49,9 +49,9 @@ const getStatusIcon = (
 		: theme.palette.text.disabled;
 	switch (state) {
 		case "complete":
-			return <CheckCircle sx={{ color, fontSize: 18 }} />;
+			return <CircleCheckIcon className="size-icon-sm" style={{ color }} />;
 		case "failure":
-			return <ErrorIcon sx={{ color, fontSize: 18 }} />;
+			return <CircleAlertIcon className="size-icon-sm" style={{ color }} />;
 		case "working":
 			// Use Hourglass for past "working" states, spinner for the current one
 			return isLatest ? (
@@ -60,7 +60,7 @@ const getStatusIcon = (
 				<HourglassIcon className="size-icon-sm" style={{ color }} />
 			);
 		default:
-			return <Warning sx={{ color, fontSize: 18 }} />;
+			return <TriangleAlertIcon className="size-icon-sm" style={{ color }} />;
 	}
 };