diff --git a/src/sql/base/browser/ui/colorbox/colorbox.ts b/src/sql/base/browser/ui/colorbox/colorbox.ts
index 4dba8603f0..20bc9c6ec5 100644
--- a/src/sql/base/browser/ui/colorbox/colorbox.ts
+++ b/src/sql/base/browser/ui/colorbox/colorbox.ts
@@ -41,6 +41,7 @@ export class Colorbox extends Widget {
 		}
 		if (opts.label) {
 			this.domNode.setAttribute('aria-label', opts.label);
+			this.domNode.title = opts.label;
 		}
 
 		container.appendChild(this.domNode);
diff --git a/src/sql/workbench/services/serverGroup/browser/serverGroupDialog.ts b/src/sql/workbench/services/serverGroup/browser/serverGroupDialog.ts
index beed857d87..dc5d88ee55 100644
--- a/src/sql/workbench/services/serverGroup/browser/serverGroupDialog.ts
+++ b/src/sql/workbench/services/serverGroup/browser/serverGroupDialog.ts
@@ -193,7 +193,7 @@ export class ServerGroupDialog extends Modal {
 			const colorColorBox = new Colorbox(container, {
 				name: 'server-group-color',
 				class: ['server-group-color'],
-				label: `Colobox Color: ${color}`,
+				label: localize('serverGroup.colorValue', "Color: {0}", color),
 			});
 
 			this._register(colorColorBox.onSelect((viaKeyboard) => {