diff --git a/src/Umbraco.Web.UI.Client/src/css/rte-content.css b/src/Umbraco.Web.UI.Client/src/css/rte-content.css
index 05aa9227a5..f6ec3cbabe 100644
--- a/src/Umbraco.Web.UI.Client/src/css/rte-content.css
+++ b/src/Umbraco.Web.UI.Client/src/css/rte-content.css
@@ -1,24 +1,5 @@
+/* TinyMCE specific styles */
 #tinymce {
-	.umb-macro-holder {
-		border: 3px dotted red;
-		padding: 7px;
-		margin: 3px;
-		display: block;
-		position: relative;
-	}
-
-	.umb-macro-holder::after {
-		content: 'Macros are no longer supported. Please use the block picker instead.';
-		position: absolute;
-		top: 50%;
-		left: 50%;
-		transform: translate(-50%, -50%);
-		color: white;
-		background-color: rgba(0, 0, 0, 0.7);
-		padding: 10px;
-		border-radius: 5px;
-	}
-
 	.umb-embed-holder {
 		position: relative;
 	}
@@ -49,3 +30,25 @@
 		outline: 2px solid var(--uui-palette-spanish-pink-light);
 	}
 }
+
+/* General styles (that apply to both TinyMCE and Tiptap RTEs) */
+
+.umb-macro-holder {
+	border: 3px dotted red;
+	padding: 7px;
+	margin: 3px;
+	display: block;
+	position: relative;
+}
+
+.umb-macro-holder::after {
+	content: 'Macros are no longer supported. Please use the block picker instead.';
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+	color: white;
+	background-color: rgba(0, 0, 0, 0.7);
+	padding: 10px;
+	border-radius: 5px;
+}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/tiptap/components/toolbar/tiptap-toolbar-menu.element.ts b/src/Umbraco.Web.UI.Client/src/packages/tiptap/components/toolbar/tiptap-toolbar-menu.element.ts
index e30cc9aefc..089ac20ade 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/tiptap/components/toolbar/tiptap-toolbar-menu.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/tiptap/components/toolbar/tiptap-toolbar-menu.element.ts
@@ -129,7 +129,7 @@ export class UmbTiptapToolbarMenuElement extends UmbLitElement {
 					</uui-button>
 				`,
 				() => html`
-					<uui-button compact look="secondary" label=${ifDefined(label)} popovertarget="popover-menu">
+					<uui-button compact label=${ifDefined(label)} popovertarget="popover-menu">
 						<span>${label}</span>
 						<uui-symbol-expand slot="extra" open></uui-symbol-expand>
 					</uui-button>
@@ -146,11 +146,12 @@ export class UmbTiptapToolbarMenuElement extends UmbLitElement {
 				--uui-button-font-weight: normal;
 				--uui-menu-item-flat-structure: 1;
 
-				margin-inline-start: var(--uui-size-space-1);
+				margin-left: var(--uui-size-space-1);
+				margin-bottom: var(--uui-size-space-1);
 			}
 
 			uui-button > uui-symbol-expand {
-				margin-left: var(--uui-size-space-4);
+				margin-left: var(--uui-size-space-2);
 			}
 		`,
 	];
diff --git a/src/Umbraco.Web.UI.Client/src/packages/tiptap/extensions/toolbar/embedded-media.tiptap-toolbar-api.ts b/src/Umbraco.Web.UI.Client/src/packages/tiptap/extensions/toolbar/embedded-media.tiptap-toolbar-api.ts
index 0a91f0801b..b691bb7c7a 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/tiptap/extensions/toolbar/embedded-media.tiptap-toolbar-api.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/tiptap/extensions/toolbar/embedded-media.tiptap-toolbar-api.ts
@@ -5,8 +5,6 @@ import { UMB_MODAL_MANAGER_CONTEXT } from '@umbraco-cms/backoffice/modal';
 import type { Editor } from '@umbraco-cms/backoffice/external/tiptap';
 
 export default class UmbTiptapToolbarEmbeddedMediaExtensionApi extends UmbTiptapToolbarElementApiBase {
-	override isActive = (editor: Editor) => editor.isActive(umbEmbeddedMedia.name) === true;
-
 	override async execute(editor?: Editor) {
 		const data = {
 			constrain: false,
diff --git a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/components/property-editor-ui-tiptap-toolbar-configuration.element.ts b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/components/property-editor-ui-tiptap-toolbar-configuration.element.ts
index 1ce96bb9ff..46525299dc 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/components/property-editor-ui-tiptap-toolbar-configuration.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/components/property-editor-ui-tiptap-toolbar-configuration.element.ts
@@ -141,16 +141,18 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 						</div>
 					</uui-input>
 				</div>
-				<div class="available-items" dropzone="move" @drop=${this.#onDrop} @dragover=${this.#onDragOver}>
-					${when(
-						this._availableExtensions.length === 0,
-						() =>
-							html`<umb-localize key="tiptap_toobar_availableItemsEmpty"
-								>There are no toolbar extensions to show</umb-localize
-							>`,
-						() => repeat(this._availableExtensions, (item) => this.#renderAvailableItem(item)),
-					)}
-				</div>
+				<uui-scroll-container>
+					<div class="available-items" dropzone="move" @drop=${this.#onDrop} @dragover=${this.#onDragOver}>
+						${when(
+							this._availableExtensions.length === 0,
+							() =>
+								html`<umb-localize key="tiptap_toobar_availableItemsEmpty"
+									>There are no toolbar extensions to show</umb-localize
+								>`,
+							() => repeat(this._availableExtensions, (item) => this.#renderAvailableItem(item)),
+						)}
+					</div>
+				</uui-scroll-container>
 			</uui-box>
 		`;
 	}
@@ -158,24 +160,23 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 	#renderAvailableItem(item: UmbTiptapToolbarExtension) {
 		const forbidden = !this.#context.isExtensionEnabled(item.alias);
 		const inUse = this.#context.isExtensionInUse(item.alias);
-		return inUse || forbidden
-			? nothing
-			: html`
-					<uui-button
-						compact
-						class=${forbidden ? 'forbidden' : ''}
-						draggable="true"
-						look=${forbidden ? 'placeholder' : 'outline'}
-						?disabled=${forbidden || inUse}
-						@click=${() => this.#onClick(item)}
-						@dragstart=${(e: DragEvent) => this.#onDragStart(e, item.alias)}
-						@dragend=${this.#onDragEnd}>
-						<div class="inner">
-							${when(item.icon, () => html`<umb-icon .name=${item.icon}></umb-icon>`)}
-							<span>${this.localize.string(item.label)}</span>
-						</div>
-					</uui-button>
-				`;
+		if (inUse || forbidden) return nothing;
+		return html`
+			<uui-button
+				compact
+				class=${forbidden ? 'forbidden' : ''}
+				draggable="true"
+				look=${forbidden ? 'placeholder' : 'outline'}
+				?disabled=${forbidden || inUse}
+				@click=${() => this.#onClick(item)}
+				@dragstart=${(e: DragEvent) => this.#onDragStart(e, item.alias)}
+				@dragend=${this.#onDragEnd}>
+				<div class="inner">
+					${when(item.icon, () => html`<umb-icon .name=${item.icon}></umb-icon>`)}
+					<span>${this.localize.string(item.label)}</span>
+				</div>
+			</uui-button>
+		`;
 	}
 
 	#renderDesigner() {
@@ -273,27 +274,52 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 	#renderItem(alias: string, rowIndex = 0, groupIndex = 0, itemIndex = 0) {
 		const item = this.#context?.getExtensionByAlias(alias);
 		if (!item) return nothing;
+
 		const forbidden = !this.#context?.isExtensionEnabled(item.alias);
-		return html`
-			<uui-button
-				compact
-				class=${forbidden ? 'forbidden' : ''}
-				draggable="true"
-				look=${forbidden ? 'placeholder' : 'outline'}
-				title=${this.localize.string(item.label)}
-				?disabled=${forbidden}
-				@click=${() => this.#context.removeToolbarItem([rowIndex, groupIndex, itemIndex])}
-				@dragend=${this.#onDragEnd}
-				@dragstart=${(e: DragEvent) => this.#onDragStart(e, alias, [rowIndex, groupIndex, itemIndex])}>
-				<div class="inner">
-					${when(
-						item.icon,
-						() => html`<umb-icon .name=${item.icon}></umb-icon>`,
-						() => html`<span>${this.localize.string(item.label)}</span>`,
-					)}
-				</div>
-			</uui-button>
-		`;
+
+		switch (item.kind) {
+			case 'menu':
+				return html`
+					<uui-button
+						compact
+						class=${forbidden ? 'forbidden' : ''}
+						draggable="true"
+						look=${forbidden ? 'placeholder' : 'outline'}
+						title=${this.localize.string(item.label)}
+						?disabled=${forbidden}
+						@click=${() => this.#context.removeToolbarItem([rowIndex, groupIndex, itemIndex])}
+						@dragend=${this.#onDragEnd}
+						@dragstart=${(e: DragEvent) => this.#onDragStart(e, alias, [rowIndex, groupIndex, itemIndex])}>
+						<div class="inner">
+							<span>${this.localize.string(item.label)}</span>
+						</div>
+						<uui-symbol-expand slot="extra" open></uui-symbol-expand>
+					</uui-button>
+				`;
+
+			case 'button':
+			default:
+				return html`
+					<uui-button
+						compact
+						class=${forbidden ? 'forbidden' : ''}
+						draggable="true"
+						look=${forbidden ? 'placeholder' : 'outline'}
+						title=${this.localize.string(item.label)}
+						?disabled=${forbidden}
+						@click=${() => this.#context.removeToolbarItem([rowIndex, groupIndex, itemIndex])}
+						@dragend=${this.#onDragEnd}
+						@dragstart=${(e: DragEvent) => this.#onDragStart(e, alias, [rowIndex, groupIndex, itemIndex])}>
+						<div class="inner">
+							${when(
+								item.icon,
+								() => html`<umb-icon .name=${item.icon}></umb-icon>`,
+								() => html`<span>${this.localize.string(item.label)}</span>`,
+							)}
+						</div>
+					</uui-button>
+				`;
+		}
 	}
 
 	static override readonly styles = [
@@ -339,6 +365,10 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 				}
 			}
 
+			uui-scroll-container {
+				max-height: 350px;
+			}
+
 			.available-items {
 				display: flex;
 				flex-wrap: wrap;
@@ -466,6 +496,10 @@ export class UmbPropertyEditorUiTiptapToolbarConfigurationElement
 										display: flex;
 										gap: var(--uui-size-1);
 									}
+
+									uui-symbol-expand {
+										margin-left: var(--uui-size-space-2);
+									}
 								}
 							}
 						}
diff --git a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/contexts/tiptap-toolbar-configuration.context.ts b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/contexts/tiptap-toolbar-configuration.context.ts
index 7214504198..93d78d4208 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/contexts/tiptap-toolbar-configuration.context.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/contexts/tiptap-toolbar-configuration.context.ts
@@ -39,8 +39,8 @@ export class UmbTiptapToolbarConfigurationContext extends UmbContextBase<UmbTipt
 		fontname: 'Umb.Tiptap.Toolbar.FontFamily',
 		fontfamily: 'Umb.Tiptap.Toolbar.FontFamily',
 		fontsize: 'Umb.Tiptap.Toolbar.FontSize',
-		forecolor: null,
-		backcolor: null,
+		forecolor: 'Umb.Tiptap.Toolbar.TextColorForeground',
+		backcolor: 'Umb.Tiptap.Toolbar.TextColorBackground',
 		blockquote: 'Umb.Tiptap.Toolbar.Blockquote',
 		formatblock: null,
 		removeformat: 'Umb.Tiptap.Toolbar.ClearFormatting',
@@ -62,8 +62,8 @@ export class UmbTiptapToolbarConfigurationContext extends UmbContextBase<UmbTipt
 		subscript: 'Umb.Tiptap.Toolbar.Subscript',
 		superscript: 'Umb.Tiptap.Toolbar.Superscript',
 		charmap: null,
-		rtl: null,
-		ltr: null,
+		rtl: 'Umb.Tiptap.Toolbar.TextDirectionRtl',
+		ltr: 'Umb.Tiptap.Toolbar.TextDirectionLtr',
 		link: 'Umb.Tiptap.Toolbar.Link',
 		unlink: 'Umb.Tiptap.Toolbar.Unlink',
 		sourcecode: 'Umb.Tiptap.Toolbar.SourceEditor',
@@ -76,12 +76,15 @@ export class UmbTiptapToolbarConfigurationContext extends UmbContextBase<UmbTipt
 		super(host, UMB_TIPTAP_TOOLBAR_CONFIGURATION_CONTEXT);
 
 		this.observe(umbExtensionsRegistry.byType('tiptapToolbarExtension'), (extensions) => {
-			const _extensions = extensions.map((ext) => ({
-				alias: ext.alias,
-				label: ext.meta.label,
-				icon: ext.meta.icon,
-				dependencies: ext.forExtensions,
-			}));
+			const _extensions = extensions
+				.sort((a, b) => a.alias.localeCompare(b.alias))
+				.map((ext) => ({
+					kind: (ext.kind as string) ?? 'button',
+					alias: ext.alias,
+					label: ext.meta.label,
+					icon: ext.meta.icon,
+					dependencies: ext.forExtensions,
+				}));
 
 			this.#extensions.setValue(_extensions);
 
diff --git a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/types.ts b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/types.ts
index 305cd36967..448accfa2c 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/types.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/tiptap/property-editors/tiptap/types.ts
@@ -1,4 +1,5 @@
 export type UmbTiptapToolbarExtension = {
+	kind?: string;
 	alias: string;
 	label: string;
 	icon: string;