diff --git a/editor/src/messages/input_mapper/input_mappings.rs b/editor/src/messages/input_mapper/input_mappings.rs
index b9bb234dc9..ffcb733624 100644
--- a/editor/src/messages/input_mapper/input_mappings.rs
+++ b/editor/src/messages/input_mapper/input_mappings.rs
@@ -339,6 +339,7 @@ pub fn input_mappings(zoom_with_scroll: bool) -> Mapping {
 		//
 		// DocumentMessage
 		entry!(KeyDown(Space); modifiers=[Control], action_dispatch=DocumentMessage::GraphViewOverlayToggle),
+		entry!(KeyDown(KeyQ); action_dispatch=DocumentMessage::ToggleDocumentMode),
 		entry!(KeyDownNoRepeat(Escape); action_dispatch=DocumentMessage::Escape),
 		entry!(KeyDown(Delete); action_dispatch=DocumentMessage::DeleteSelectedLayers),
 		entry!(KeyDown(Backspace); action_dispatch=DocumentMessage::DeleteSelectedLayers),
diff --git a/editor/src/messages/portfolio/document/document_message.rs b/editor/src/messages/portfolio/document/document_message.rs
index dcd528c9e4..4463e441cb 100644
--- a/editor/src/messages/portfolio/document/document_message.rs
+++ b/editor/src/messages/portfolio/document/document_message.rs
@@ -6,7 +6,7 @@ use crate::messages::input_mapper::utility_types::input_keyboard::Key;
 use crate::messages::portfolio::document::data_panel::DataPanelMessage;
 use crate::messages::portfolio::document::overlays::utility_types::{OverlayContext, OverlaysType};
 use crate::messages::portfolio::document::utility_types::document_metadata::LayerNodeIdentifier;
-use crate::messages::portfolio::document::utility_types::misc::{AlignAggregate, AlignAxis, FlipAxis, GridSnapping};
+use crate::messages::portfolio::document::utility_types::misc::{AlignAggregate, AlignAxis, DocumentMode, FlipAxis, GridSnapping};
 use crate::messages::portfolio::utility_types::PanelType;
 use crate::messages::prelude::*;
 use glam::{DAffine2, IVec2};
@@ -187,6 +187,10 @@ pub enum DocumentMessage {
 	SetRenderMode {
 		render_mode: RenderMode,
 	},
+	ToggleDocumentMode,
+	SetDocumentMode {
+		document_mode: DocumentMode,
+	},
 	AddTransaction,
 	StartTransaction,
 	EndTransaction,
diff --git a/editor/src/messages/portfolio/document/document_message_handler.rs b/editor/src/messages/portfolio/document/document_message_handler.rs
index f093a90999..2e218601b1 100644
--- a/editor/src/messages/portfolio/document/document_message_handler.rs
+++ b/editor/src/messages/portfolio/document/document_message_handler.rs
@@ -18,7 +18,7 @@ use crate::messages::portfolio::document::overlays::grid_overlays::{grid_overlay
 use crate::messages::portfolio::document::overlays::utility_types::{OverlaysType, OverlaysVisibilitySettings, Pivot};
 use crate::messages::portfolio::document::properties_panel::properties_panel_message_handler::PropertiesPanelMessageContext;
 use crate::messages::portfolio::document::utility_types::document_metadata::{DocumentMetadata, LayerNodeIdentifier};
-use crate::messages::portfolio::document::utility_types::misc::{AlignAggregate, AlignAxis, FlipAxis, PTZ};
+use crate::messages::portfolio::document::utility_types::misc::{AlignAggregate, AlignAxis, DocumentMode, FlipAxis, PTZ};
 use crate::messages::portfolio::document::utility_types::network_interface::{FlowType, InputConnector, NodeTemplate};
 use crate::messages::portfolio::utility_types::{PanelType, PersistentData};
 use crate::messages::prelude::*;
@@ -115,6 +115,9 @@ pub struct DocumentMessageHandler {
 	/// The name of the document, which is displayed in the tab and title bar of the editor.
 	#[serde(skip)]
 	pub name: String,
+	/// The current editor-only mode for the active document.
+	#[serde(skip)]
+	pub document_mode: DocumentMode,
 	/// The path of the to the document file.
 	#[serde(skip)]
 	pub(crate) path: Option<PathBuf>,
@@ -173,6 +176,7 @@ impl Default for DocumentMessageHandler {
 			// Fields omitted from the saved document format
 			// =============================================
 			name: DEFAULT_DOCUMENT_NAME.to_string(),
+			document_mode: DocumentMode::default(),
 			path: None,
 			breadcrumb_network_path: Vec::new(),
 			selection_network_path: Vec::new(),
@@ -1108,6 +1112,15 @@ impl MessageHandler<DocumentMessage, DocumentMessageContext<'_>> for DocumentMes
 				self.render_mode = render_mode;
 				responses.add_front(NodeGraphMessage::RunDocumentGraph);
 			}
+			DocumentMessage::ToggleDocumentMode => {
+				self.document_mode = match self.document_mode {
+					DocumentMode::MaskMode => DocumentMode::DesignMode,
+					_ => DocumentMode::MaskMode,
+				};
+			}
+			DocumentMessage::SetDocumentMode { document_mode } => {
+				self.document_mode = document_mode;
+			}
 			DocumentMessage::AddTransaction => {
 				// Reverse order since they are added to the front
 				responses.add_front(DocumentMessage::CommitTransaction);
@@ -1463,6 +1476,8 @@ impl MessageHandler<DocumentMessage, DocumentMessageContext<'_>> for DocumentMes
 			SaveDocument,
 			SelectAllLayers,
 			SetSnapping,
+			ToggleDocumentMode,
+			SetDocumentMode,
 			ToggleGridVisibility,
 			ToggleOverlaysVisibility,
 			ToggleSnapping,
diff --git a/editor/src/messages/portfolio/document/utility_types/misc.rs b/editor/src/messages/portfolio/document/utility_types/misc.rs
index 7ea2b5dc21..b94895c6c7 100644
--- a/editor/src/messages/portfolio/document/utility_types/misc.rs
+++ b/editor/src/messages/portfolio/document/utility_types/misc.rs
@@ -28,13 +28,15 @@ pub enum AlignAggregate {
 	Center,
 }
 
-// #[derive(Default, PartialEq, Eq, Clone, Copy, Debug, serde::Serialize, serde::Deserialize)]
-// pub enum DocumentMode {
-// 	#[default]
-// 	DesignMode,
-// 	SelectMode,
-// 	GuideMode,
-// }
+#[cfg_attr(feature = "wasm", derive(tsify::Tsify))]
+#[derive(Default, PartialEq, Eq, Clone, Copy, Debug, serde::Serialize, serde::Deserialize)]
+pub enum DocumentMode {
+	#[default]
+	DesignMode,
+	SelectMode,
+	GuideMode,
+	MaskMode,
+}
 
 // impl fmt::Display for DocumentMode {
 // 	fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
@@ -42,6 +44,7 @@ pub enum AlignAggregate {
 // 			DocumentMode::DesignMode => write!(f, "Design Mode"),
 // 			DocumentMode::SelectMode => write!(f, "Select Mode"),
 // 			DocumentMode::GuideMode => write!(f, "Guide Mode"),
+// 			DocumentMode::MaskMode => write!(f, "Mask Mode"),
 // 		}
 // 	}
 // }