diff --git a/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.css b/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.css
index 1f56926a9..e94511138 100644
--- a/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.css
+++ b/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.css
@@ -4,8 +4,8 @@
 }
 
 .color-picker-menu-item > .color-cell {
-    width: 16px;
-    height: 16px;
+    width: 13px;
+    height: 13px;
     border-radius: 4px;
     background: transparent;
 }
diff --git a/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.tsx b/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.tsx
index b87387a8f..66b4010d9 100644
--- a/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.tsx
+++ b/apps/client/src/menus/custom-items/NoteColorPickerMenuItem.tsx
@@ -6,7 +6,10 @@ import Debouncer from "../../utils/debouncer";
 import FNote from "../../entities/fnote";
 import froca from "../../services/froca";
 
-const COLORS = ["blue", "green", "cyan", "red", "magenta", "brown", "yellow", null];
+const COLORS = [
+    "#e64d4d", "#e6994d", "#e5e64d", "#99e64d", "#4de64d", "#4de699",
+    "#4de5e6", "#4d99e6", "#4d4de6", "#994de6", null
+];
 
 export interface NoteColorPickerMenuItemProps {
     /** The target Note instance or its ID string. */