diff --git a/client/web/assets/24px-two-tone/document-tool-layout-crop.svg b/client/web/assets/24px-two-tone/layout-crop-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-layout-crop.svg
rename to client/web/assets/24px-two-tone/layout-crop-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-layout-eyedropper.svg b/client/web/assets/24px-two-tone/layout-eyedropper-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-layout-eyedropper.svg
rename to client/web/assets/24px-two-tone/layout-eyedropper-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-layout-navigate.svg b/client/web/assets/24px-two-tone/layout-navigate-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-layout-navigate.svg
rename to client/web/assets/24px-two-tone/layout-navigate-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-layout-select.svg b/client/web/assets/24px-two-tone/layout-select-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-layout-select.svg
rename to client/web/assets/24px-two-tone/layout-select-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-parametric-fill.svg b/client/web/assets/24px-two-tone/parametric-fill-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-parametric-fill.svg
rename to client/web/assets/24px-two-tone/parametric-fill-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-parametric-gradient.svg b/client/web/assets/24px-two-tone/parametric-gradient-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-parametric-gradient.svg
rename to client/web/assets/24px-two-tone/parametric-gradient-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-parametric-text.svg b/client/web/assets/24px-two-tone/parametric-text-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-parametric-text.svg
rename to client/web/assets/24px-two-tone/parametric-text-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-brush.svg b/client/web/assets/24px-two-tone/raster-brush-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-brush.svg
rename to client/web/assets/24px-two-tone/raster-brush-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-clone.svg b/client/web/assets/24px-two-tone/raster-clone-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-clone.svg
rename to client/web/assets/24px-two-tone/raster-clone-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-detail.svg b/client/web/assets/24px-two-tone/raster-detail-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-detail.svg
rename to client/web/assets/24px-two-tone/raster-detail-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-heal.svg b/client/web/assets/24px-two-tone/raster-heal-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-heal.svg
rename to client/web/assets/24px-two-tone/raster-heal-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-patch.svg b/client/web/assets/24px-two-tone/raster-patch-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-patch.svg
rename to client/web/assets/24px-two-tone/raster-patch-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-raster-relight.svg b/client/web/assets/24px-two-tone/raster-relight-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-raster-relight.svg
rename to client/web/assets/24px-two-tone/raster-relight-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-ellipse.svg b/client/web/assets/24px-two-tone/vector-ellipse-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-ellipse.svg
rename to client/web/assets/24px-two-tone/vector-ellipse-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-freehand.svg b/client/web/assets/24px-two-tone/vector-freehand-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-freehand.svg
rename to client/web/assets/24px-two-tone/vector-freehand-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-line.svg b/client/web/assets/24px-two-tone/vector-line-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-line.svg
rename to client/web/assets/24px-two-tone/vector-line-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-path.svg b/client/web/assets/24px-two-tone/vector-path-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-path.svg
rename to client/web/assets/24px-two-tone/vector-path-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-pen.svg b/client/web/assets/24px-two-tone/vector-pen-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-pen.svg
rename to client/web/assets/24px-two-tone/vector-pen-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-rectangle.svg b/client/web/assets/24px-two-tone/vector-rectangle-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-rectangle.svg
rename to client/web/assets/24px-two-tone/vector-rectangle-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-shape.svg b/client/web/assets/24px-two-tone/vector-shape-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-shape.svg
rename to client/web/assets/24px-two-tone/vector-shape-tool.svg
diff --git a/client/web/assets/24px-two-tone/document-tool-vector-spline.svg b/client/web/assets/24px-two-tone/vector-spline-tool.svg
similarity index 100%
rename from client/web/assets/24px-two-tone/document-tool-vector-spline.svg
rename to client/web/assets/24px-two-tone/vector-spline-tool.svg
diff --git a/client/web/src/components/panels/Document.vue b/client/web/src/components/panels/Document.vue
index 5bd5382c9..f20b6e921 100644
--- a/client/web/src/components/panels/Document.vue
+++ b/client/web/src/components/panels/Document.vue
@@ -104,36 +104,36 @@
 		<LayoutRow :class="'shelf-and-viewport'">
 			<LayoutCol :class="'shelf'">
 				<div class="tools">
-					<ShelfItem :icon="'SelectTool'" title="Select Tool (V)" :active="activeTool === 'Select'" @click="selectTool('Select')" />
-					<ShelfItem :icon="'CropTool'" title="Crop Tool" :active="activeTool === 'Crop'" @click="'tool not implemented' || selectTool('Crop')" />
-					<ShelfItem :icon="'NavigateTool'" title="Navigate Tool (Z)" :active="activeTool === 'Navigate'" @click="'tool not implemented' || selectTool('Navigate')" />
-					<ShelfItem :icon="'EyedropperTool'" title="Eyedropper Tool (I)" :active="activeTool === 'Eyedropper'" @click="'tool not implemented' || selectTool('Eyedropper')" />
+					<ShelfItem :icon="'LayoutSelectTool'" title="Select Tool (V)" :active="activeTool === 'Select'" @click="selectTool('Select')" />
+					<ShelfItem :icon="'LayoutCropTool'" title="Crop Tool" :active="activeTool === 'Crop'" @click="'tool not implemented' || selectTool('Crop')" />
+					<ShelfItem :icon="'LayoutNavigateTool'" title="Navigate Tool (Z)" :active="activeTool === 'Navigate'" @click="'tool not implemented' || selectTool('Navigate')" />
+					<ShelfItem :icon="'LayoutEyedropperTool'" title="Eyedropper Tool (I)" :active="activeTool === 'Eyedropper'" @click="'tool not implemented' || selectTool('Eyedropper')" />
 
 					<Separator :type="SeparatorType.Section" :direction="SeparatorDirection.Vertical" />
 
-					<ShelfItem :icon="'TextTool'" title="Text Tool (T)" :active="activeTool === 'Text'" @click="'tool not implemented' || selectTool('Text')" />
-					<ShelfItem :icon="'FillTool'" title="Fill Tool (F)" :active="activeTool === 'Fill'" @click="selectTool('Fill')" />
-					<ShelfItem :icon="'GradientTool'" title="Gradient Tool (H)" :active="activeTool === 'Gradient'" @click="'tool not implemented' || selectTool('Gradient')" />
+					<ShelfItem :icon="'ParametricTextTool'" title="Text Tool (T)" :active="activeTool === 'Text'" @click="'tool not implemented' || selectTool('Text')" />
+					<ShelfItem :icon="'ParametricFillTool'" title="Fill Tool (F)" :active="activeTool === 'Fill'" @click="selectTool('Fill')" />
+					<ShelfItem :icon="'ParametricGradientTool'" title="Gradient Tool (H)" :active="activeTool === 'Gradient'" @click="'tool not implemented' || selectTool('Gradient')" />
 
 					<Separator :type="SeparatorType.Section" :direction="SeparatorDirection.Vertical" />
 
-					<ShelfItem :icon="'BrushTool'" title="Brush Tool (B)" :active="activeTool === 'Brush'" @click="'tool not implemented' || selectTool('Brush')" />
-					<ShelfItem :icon="'HealTool'" title="Heal Tool (J)" :active="activeTool === 'Heal'" @click="'tool not implemented' || selectTool('Heal')" />
-					<ShelfItem :icon="'CloneTool'" title="Clone Tool (C)" :active="activeTool === 'Clone'" @click="'tool not implemented' || selectTool('Clone')" />
-					<ShelfItem :icon="'PatchTool'" title="Patch Tool" :active="activeTool === 'Patch'" @click="'tool not implemented' || selectTool('Patch')" />
-					<ShelfItem :icon="'BlurSharpenTool'" title="Detail Tool (D)" :active="activeTool === 'BlurSharpen'" @click="'tool not implemented' || selectTool('BlurSharpen')" />
-					<ShelfItem :icon="'RelightTool'" title="Relight Tool (O)" :active="activeTool === 'Relight'" @click="'tool not implemented' || selectTool('Relight')" />
+					<ShelfItem :icon="'RasterBrushTool'" title="Brush Tool (B)" :active="activeTool === 'Brush'" @click="'tool not implemented' || selectTool('Brush')" />
+					<ShelfItem :icon="'RasterHealTool'" title="Heal Tool (J)" :active="activeTool === 'Heal'" @click="'tool not implemented' || selectTool('Heal')" />
+					<ShelfItem :icon="'RasterCloneTool'" title="Clone Tool (C)" :active="activeTool === 'Clone'" @click="'tool not implemented' || selectTool('Clone')" />
+					<ShelfItem :icon="'RasterPatchTool'" title="Patch Tool" :active="activeTool === 'Patch'" @click="'tool not implemented' || selectTool('Patch')" />
+					<ShelfItem :icon="'RasterBlurSharpenTool'" title="Detail Tool (D)" :active="activeTool === 'BlurSharpen'" @click="'tool not implemented' || selectTool('BlurSharpen')" />
+					<ShelfItem :icon="'RasterRelightTool'" title="Relight Tool (O)" :active="activeTool === 'Relight'" @click="'tool not implemented' || selectTool('Relight')" />
 
 					<Separator :type="SeparatorType.Section" :direction="SeparatorDirection.Vertical" />
 
-					<ShelfItem :icon="'PathTool'" title="Path Tool (A)" :active="activeTool === 'Path'" @click="'tool not implemented' || selectTool('Path')" />
-					<ShelfItem :icon="'PenTool'" title="Pen Tool (P)" :active="activeTool === 'Pen'" @click="selectTool('Pen')" />
-					<ShelfItem :icon="'FreehandTool'" title="Freehand Tool (N)" :active="activeTool === 'Freehand'" @click="'tool not implemented' || selectTool('Freehand')" />
-					<ShelfItem :icon="'SplineTool'" title="Spline Tool" :active="activeTool === 'Spline'" @click="'tool not implemented' || selectTool('Spline')" />
-					<ShelfItem :icon="'LineTool'" title="Line Tool (L)" :active="activeTool === 'Line'" @click="selectTool('Line')" />
-					<ShelfItem :icon="'RectangleTool'" title="Rectangle Tool (M)" :active="activeTool === 'Rectangle'" @click="selectTool('Rectangle')" />
-					<ShelfItem :icon="'EllipseTool'" title="Ellipse Tool (E)" :active="activeTool === 'Ellipse'" @click="selectTool('Ellipse')" />
-					<ShelfItem :icon="'ShapeTool'" title="Shape Tool (Y)" :active="activeTool === 'Shape'" @click="selectTool('Shape')" />
+					<ShelfItem :icon="'VectorPathTool'" title="Path Tool (A)" :active="activeTool === 'Path'" @click="'tool not implemented' || selectTool('Path')" />
+					<ShelfItem :icon="'VectorPenTool'" title="Pen Tool (P)" :active="activeTool === 'Pen'" @click="selectTool('Pen')" />
+					<ShelfItem :icon="'VectorFreehandTool'" title="Freehand Tool (N)" :active="activeTool === 'Freehand'" @click="'tool not implemented' || selectTool('Freehand')" />
+					<ShelfItem :icon="'VectorSplineTool'" title="Spline Tool" :active="activeTool === 'Spline'" @click="'tool not implemented' || selectTool('Spline')" />
+					<ShelfItem :icon="'VectorLineTool'" title="Line Tool (L)" :active="activeTool === 'Line'" @click="selectTool('Line')" />
+					<ShelfItem :icon="'VectorRectangleTool'" title="Rectangle Tool (M)" :active="activeTool === 'Rectangle'" @click="selectTool('Rectangle')" />
+					<ShelfItem :icon="'VectorEllipseTool'" title="Ellipse Tool (E)" :active="activeTool === 'Ellipse'" @click="selectTool('Ellipse')" />
+					<ShelfItem :icon="'VectorShapeTool'" title="Shape Tool (Y)" :active="activeTool === 'Shape'" @click="selectTool('Shape')" />
 				</div>
 				<div class="spacer"></div>
 				<WorkingColors />
diff --git a/client/web/src/components/widgets/labels/Icon.vue b/client/web/src/components/widgets/labels/Icon.vue
index fd0c4fa60..e60586add 100644
--- a/client/web/src/components/widgets/labels/Icon.vue
+++ b/client/web/src/components/widgets/labels/Icon.vue
@@ -30,27 +30,27 @@
 <script lang="ts">
 import { defineComponent } from "vue";
 
-import SelectTool from "@/../assets/24px-two-tone/document-tool-layout-select.svg"; // TODO: Rename
-import CropTool from "@/../assets/24px-two-tone/document-tool-layout-crop.svg"; // TODO: Rename
-import NavigateTool from "@/../assets/24px-two-tone/document-tool-layout-navigate.svg"; // TODO: Rename
-import EyedropperTool from "@/../assets/24px-two-tone/document-tool-layout-eyedropper.svg"; // TODO: Rename
-import TextTool from "@/../assets/24px-two-tone/document-tool-parametric-text.svg"; // TODO: Rename
-import FillTool from "@/../assets/24px-two-tone/document-tool-parametric-fill.svg"; // TODO: Rename
-import GradientTool from "@/../assets/24px-two-tone/document-tool-parametric-gradient.svg"; // TODO: Rename
-import BrushTool from "@/../assets/24px-two-tone/document-tool-raster-brush.svg"; // TODO: Rename
-import HealTool from "@/../assets/24px-two-tone/document-tool-raster-heal.svg"; // TODO: Rename
-import CloneTool from "@/../assets/24px-two-tone/document-tool-raster-clone.svg"; // TODO: Rename
-import PatchTool from "@/../assets/24px-two-tone/document-tool-raster-patch.svg"; // TODO: Rename
-import BlurSharpenTool from "@/../assets/24px-two-tone/document-tool-raster-detail.svg"; // TODO: Rename
-import RelightTool from "@/../assets/24px-two-tone/document-tool-raster-relight.svg"; // TODO: Rename
-import PathTool from "@/../assets/24px-two-tone/document-tool-vector-path.svg"; // TODO: Rename
-import PenTool from "@/../assets/24px-two-tone/document-tool-vector-pen.svg"; // TODO: Rename
-import FreehandTool from "@/../assets/24px-two-tone/document-tool-vector-freehand.svg"; // TODO: Rename
-import SplineTool from "@/../assets/24px-two-tone/document-tool-vector-spline.svg"; // TODO: Rename
-import LineTool from "@/../assets/24px-two-tone/document-tool-vector-line.svg"; // TODO: Rename
-import RectangleTool from "@/../assets/24px-two-tone/document-tool-vector-rectangle.svg"; // TODO: Rename
-import EllipseTool from "@/../assets/24px-two-tone/document-tool-vector-ellipse.svg"; // TODO: Rename
-import ShapeTool from "@/../assets/24px-two-tone/document-tool-vector-shape.svg"; // TODO: Rename
+import LayoutSelectTool from "@/../assets/24px-two-tone/layout-select-tool.svg";
+import LayoutCropTool from "@/../assets/24px-two-tone/layout-crop-tool.svg";
+import LayoutNavigateTool from "@/../assets/24px-two-tone/layout-navigate-tool.svg";
+import LayoutEyedropperTool from "@/../assets/24px-two-tone/layout-eyedropper-tool.svg";
+import ParametricTextTool from "@/../assets/24px-two-tone/parametric-text-tool.svg";
+import ParametricFillTool from "@/../assets/24px-two-tone/parametric-fill-tool.svg";
+import ParametricGradientTool from "@/../assets/24px-two-tone/parametric-gradient-tool.svg";
+import RasterBrushTool from "@/../assets/24px-two-tone/raster-brush-tool.svg";
+import RasterHealTool from "@/../assets/24px-two-tone/raster-heal-tool.svg";
+import RasterCloneTool from "@/../assets/24px-two-tone/raster-clone-tool.svg";
+import RasterPatchTool from "@/../assets/24px-two-tone/raster-patch-tool.svg";
+import RasterBlurSharpenTool from "@/../assets/24px-two-tone/raster-detail-tool.svg";
+import RasterRelightTool from "@/../assets/24px-two-tone/raster-relight-tool.svg";
+import VectorPathTool from "@/../assets/24px-two-tone/vector-path-tool.svg";
+import VectorPenTool from "@/../assets/24px-two-tone/vector-pen-tool.svg";
+import VectorFreehandTool from "@/../assets/24px-two-tone/vector-freehand-tool.svg";
+import VectorSplineTool from "@/../assets/24px-two-tone/vector-spline-tool.svg";
+import VectorLineTool from "@/../assets/24px-two-tone/vector-line-tool.svg";
+import VectorRectangleTool from "@/../assets/24px-two-tone/vector-rectangle-tool.svg";
+import VectorEllipseTool from "@/../assets/24px-two-tone/vector-ellipse-tool.svg";
+import VectorShapeTool from "@/../assets/24px-two-tone/vector-shape-tool.svg";
 
 import AlignHorizontalLeft from "@/../assets/16px-solid/align-horizontal-left.svg";
 import AlignHorizontalCenter from "@/../assets/16px-solid/align-horizontal-center.svg";
@@ -113,27 +113,27 @@ import MouseHintMMBDrag from "@/../assets/16px-two-tone/mouse-hint-mmb-drag.svg"
 import NodeTypePath from "@/../assets/24px-full-color/node-type-path.svg";
 
 const icons = {
-	SelectTool: { component: SelectTool, size: 24 },
-	CropTool: { component: CropTool, size: 24 },
-	NavigateTool: { component: NavigateTool, size: 24 },
-	EyedropperTool: { component: EyedropperTool, size: 24 },
-	TextTool: { component: TextTool, size: 24 },
-	FillTool: { component: FillTool, size: 24 },
-	GradientTool: { component: GradientTool, size: 24 },
-	BrushTool: { component: BrushTool, size: 24 },
-	HealTool: { component: HealTool, size: 24 },
-	CloneTool: { component: CloneTool, size: 24 },
-	PatchTool: { component: PatchTool, size: 24 },
-	BlurSharpenTool: { component: BlurSharpenTool, size: 24 },
-	RelightTool: { component: RelightTool, size: 24 },
-	PathTool: { component: PathTool, size: 24 },
-	PenTool: { component: PenTool, size: 24 },
-	FreehandTool: { component: FreehandTool, size: 24 },
-	SplineTool: { component: SplineTool, size: 24 },
-	LineTool: { component: LineTool, size: 24 },
-	RectangleTool: { component: RectangleTool, size: 24 },
-	EllipseTool: { component: EllipseTool, size: 24 },
-	ShapeTool: { component: ShapeTool, size: 24 },
+	LayoutSelectTool: { component: LayoutSelectTool, size: 24 },
+	LayoutCropTool: { component: LayoutCropTool, size: 24 },
+	LayoutNavigateTool: { component: LayoutNavigateTool, size: 24 },
+	LayoutEyedropperTool: { component: LayoutEyedropperTool, size: 24 },
+	ParametricTextTool: { component: ParametricTextTool, size: 24 },
+	ParametricFillTool: { component: ParametricFillTool, size: 24 },
+	ParametricGradientTool: { component: ParametricGradientTool, size: 24 },
+	RasterBrushTool: { component: RasterBrushTool, size: 24 },
+	RasterHealTool: { component: RasterHealTool, size: 24 },
+	RasterCloneTool: { component: RasterCloneTool, size: 24 },
+	RasterPatchTool: { component: RasterPatchTool, size: 24 },
+	RasterBlurSharpenTool: { component: RasterBlurSharpenTool, size: 24 },
+	RasterRelightTool: { component: RasterRelightTool, size: 24 },
+	VectorPathTool: { component: VectorPathTool, size: 24 },
+	VectorPenTool: { component: VectorPenTool, size: 24 },
+	VectorFreehandTool: { component: VectorFreehandTool, size: 24 },
+	VectorSplineTool: { component: VectorSplineTool, size: 24 },
+	VectorLineTool: { component: VectorLineTool, size: 24 },
+	VectorRectangleTool: { component: VectorRectangleTool, size: 24 },
+	VectorEllipseTool: { component: VectorEllipseTool, size: 24 },
+	VectorShapeTool: { component: VectorShapeTool, size: 24 },
 	AlignHorizontalLeft: { component: AlignHorizontalLeft, size: 16 },
 	AlignHorizontalCenter: { component: AlignHorizontalCenter, size: 16 },
 	AlignHorizontalRight: { component: AlignHorizontalRight, size: 16 },