diff --git a/packages/web_ui/src/components/SlaveViewPage.jsx b/packages/web_ui/src/components/SlaveViewPage.jsx
index c5a985bd..b1ce562d 100644
--- a/packages/web_ui/src/components/SlaveViewPage.jsx
+++ b/packages/web_ui/src/components/SlaveViewPage.jsx
@@ -44,7 +44,11 @@ export default function SlaveViewPage(props) {
 
 		<Descriptions bordered size="small" column={{ xs: 1, sm: 2, xl: 4 }}>
 			<Descriptions.Item label="Name">{slave["name"]}</Descriptions.Item>
-			<Descriptions.Item label="Connected">{slave["connected"] ? "yes" : "no"}</Descriptions.Item>
+			<Descriptions.Item label="Connected">
+				<Tag color={slave["connected"] ? "#389e0d" : "#cf1322"}>
+					{slave["connected"] ? "Connected" : "Disconnected"}
+				</Tag>
+			</Descriptions.Item>
 			<Descriptions.Item label="Agent">{slave["agent"]}</Descriptions.Item>
 			<Descriptions.Item label="Version">{slave["version"]}</Descriptions.Item>
 		</Descriptions>