diff --git a/packages/main/cypress/specs/ColorPalettePopover.cy.tsx b/packages/main/cypress/specs/ColorPalettePopover.cy.tsx
index bad0c933f675..20b6aa52b684 100644
--- a/packages/main/cypress/specs/ColorPalettePopover.cy.tsx
+++ b/packages/main/cypress/specs/ColorPalettePopover.cy.tsx
@@ -543,7 +543,7 @@ describe("Color Popover Palette arrow keys navigation", () => {
 });
 
 describe("Color Popover Palette Home and End keyboard navigation", () => {
-    it.skip("should navigate with Home/End when showDefaultColor is set", () => {
+    it("should navigate with Home/End when showDefaultColor is set", () => {
         cy.mount(
             <SimplePalettePopover showDefaultColor={true} />
         );
@@ -551,67 +551,34 @@ describe("Color Popover Palette Home and End keyboard navigation", () => {
         cy.get("[ui5-color-palette-popover]")
             .ui5ColorPalettePopoverOpen({ opener: "btnPalette" });
 
-        cy.get("[ui5-color-palette-popover]")
-            .should("have.attr", "open");
-
-        cy.get("[ui5-color-palette-popover]")
-            .ui5GetColorPaletteInPopover()
-            .as("colorPalette");
-
-        cy.get("@colorPalette")
-            .ui5GetColorPaletteDefaultButton()
-            .as("defaultColorButton")
-            .should("be.visible")
-            .and("have.focus");
-
-        cy.get("@defaultColorButton")
-            .should("have.focus")
-            .shadow()
-            .find("button[data-sap-focus-ref]")
-            .should("have.focus");
+        // Default Color button should be focused initially
+        cy.focused()
+            .should("have.attr", "aria-label", "Default Color");
 
-        cy.get("@defaultColorButton")
+        // End → last color item (red)
+        cy.focused()
             .realPress("End");
 
-        cy.get("[ui5-color-palette-popover]")
-            .ui5GetColorPaletteItem(3)
-            .as("lastColorPaletteItem")
-            .should("be.visible")
-            .and("have.attr", "value", "red");
-
-        cy.get("@lastColorPaletteItem")
-            .should("have.focus")
-            .shadow()
-            .find(".ui5-cp-item")
+        cy.focused()
             .should("have.attr", "tabindex", "0")
             .and("have.attr", "aria-label")
             .and("include", "red");
 
+        // Home → first color item (cyan)
         cy.focused()
             .realPress("Home");
 
-        cy.get("[ui5-color-palette-popover]")
-            .ui5GetColorPaletteItem(0)
-            .as("firstColorPaletteItem")
-            .should("be.visible")
-            .and("have.attr", "value", "cyan");
-
-        cy.get("@firstColorPaletteItem")
-            .should("have.focus")
-            .shadow()
-            .find(".ui5-cp-item")
+        cy.focused()
             .should("have.attr", "tabindex", "0")
             .and("have.attr", "aria-label")
             .and("include", "cyan");
 
+        // Home again → Default Color button
         cy.focused()
             .realPress("Home");
 
         cy.focused()
             .should("have.attr", "aria-label", "Default Color");
-
-        cy.get("@defaultColorButton")
-            .should("have.focus");
     });
 
     it("should navigate with Home/End keys when showMoreColors is set", () => {
@@ -640,42 +607,31 @@ describe("Color Popover Palette Home and End keyboard navigation", () => {
             .should("have.attr", "aria-label", "More Colors...");
     });
 
-    it.skip("should navigate with Home/End when showDefaultColor & showMoreColors are set", () => {
+    it("should navigate with Home/End when showDefaultColor & showMoreColors are set", () => {
         cy.mount(
             <SimplePalettePopover showDefaultColor={true} showMoreColors={true} />
         );
 
-        cy.get<ColorPalettePopover>("[ui5-color-palette-popover]")
-            .as("colorPalettePopover")
+        cy.get("[ui5-color-palette-popover]")
             .ui5ColorPalettePopoverOpen({ opener: "btnPalette" });
 
-        cy.get<ColorPalette>("@colorPalettePopover")
-            .ui5GetColorPaletteInPopover()
-            .as("colorPalette");
-
-        cy.get("@colorPalette")
-            .ui5GetColorPaletteDefaultButton()
-            .as("defaultColorButton");
+        // Default Color button should be focused initially
+        cy.focused()
+            .should("have.attr", "aria-label", "Default Color");
 
-        cy.get("@defaultColorButton")
-            .should("have.focus")
+        // End → More Colors button
+        cy.focused()
             .realPress("End");
 
-        cy.get("@colorPalette")
-            .ui5GetColorPaletteMoreColorsButton()
-            .as("moreColorsButton")
-            .should("be.visible");
-
-        cy.get("@moreColorsButton")
-            .should("exist")
-            .and("be.visible")
-            .and("have.focus");
+        cy.focused()
+            .should("have.attr", "aria-label", "More Colors...");
 
-        cy.get("@moreColorsButton")
+        // Home → Default Color button
+        cy.focused()
             .realPress("Home");
 
-        cy.get("@defaultColorButton")
-            .should("have.focus");
+        cy.focused()
+            .should("have.attr", "aria-label", "Default Color");
     });
 
     it("should navigate with End key", () => {
diff --git a/packages/main/src/ColorPaletteTemplate.tsx b/packages/main/src/ColorPaletteTemplate.tsx
index 90b3ca10bfff..e5cf921844aa 100644
--- a/packages/main/src/ColorPaletteTemplate.tsx
+++ b/packages/main/src/ColorPaletteTemplate.tsx
@@ -18,13 +18,14 @@ export default function ColorPaletteTemplate(this: ColorPalette) {
 				onMouseDown={this._onmousedown}
 			>
 				{this.showDefaultColor &&
-					<div class="ui5-cp-default-color-button-wrapper">
+					<div class="ui5-cp-default-color-button-wrapper"
+						onKeyDown={this._onDefaultColorKeyDown}
+						onKeyUp={this._onDefaultColorKeyUp}
+					>
 						<Button
 							class="ui5-cp-default-color-button"
 							design="Transparent"
 							onClick={this._onDefaultColorClick}
-							onKeyUp={this._onDefaultColorKeyUp}
-							onKeyDown={this._onDefaultColorKeyDown}
 						>
 							{this.colorPaletteDefaultColorText}
 						</Button>
@@ -42,13 +43,14 @@ export default function ColorPaletteTemplate(this: ColorPalette) {
 				</div>
 
 				{this.showMoreColors &&
-					<div class="ui5-cp-more-colors-wrapper">
+					<div class="ui5-cp-more-colors-wrapper"
+						onKeyDown={this._onMoreColorsKeyDown}
+					>
 						<div class="ui5-cp-separator"></div>
 						<Button
 							design="Transparent"
 							class="ui5-cp-more-colors"
 							onClick={this._openMoreColorsDialog}
-							onKeyDown={this._onMoreColorsKeyDown}
 						>
 							{this.colorPaletteMoreColorsText}
 						</Button>