diff --git a/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx b/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx
index 4a922a9fb25..56e86d16982 100644
--- a/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx
+++ b/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx
@@ -10,7 +10,9 @@ const fileTree: FileTree = {
 	"outputs.tf": "output my_output {}",
 	"README.md": "# Example\n\nThis is an example.",
 	"install.sh": "#!/bin/bash\necho 'Installing...'",
-	"config.txt": "key=value",
+	"config.json": '{"name": "example"}',
+	"docker-compose.yml": "version: '3'",
+	Dockerfile: "FROM ubuntu:latest",
 	"app.py": "print('Hello')",
 	folder: {
 		"nested.tf": "resource aws_instance my_instance {}",
diff --git a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx
index ce869839307..929b7811353 100644
--- a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx
+++ b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx
@@ -4,10 +4,13 @@ import MenuItem from "@mui/material/MenuItem";
 import { SimpleTreeView, TreeItem } from "@mui/x-tree-view";
 import { DockerIcon } from "components/Icons/DockerIcon";
 import {
+	BracesIcon,
 	ChevronDownIcon,
 	ChevronRightIcon,
+	FileCodeIcon,
 	FileIcon,
 	FolderIcon,
+	TerminalIcon,
 } from "lucide-react";
 import {
 	type CSSProperties,
@@ -100,6 +103,12 @@ export const TemplateFileTree: FC<TemplateFilesTreeProps> = ({
 			icon = FileTypeMarkdown;
 		} else if (filename.endsWith("Dockerfile")) {
 			icon = DockerIcon;
+		} else if (filename.endsWith(".sh")) {
+			icon = TerminalIcon;
+		} else if (filename.endsWith(".json")) {
+			icon = BracesIcon;
+		} else if (filename.endsWith(".yaml") || filename.endsWith(".yml")) {
+			icon = FileCodeIcon;
 		} else {
 			// Default icon for files without a specific icon.
 			icon = FileIcon;