diff --git a/src/components/panes/configure-panes/keycode.tsx b/src/components/panes/configure-panes/keycode.tsx
index 78bb5fb8..bbd198b3 100644
--- a/src/components/panes/configure-panes/keycode.tsx
+++ b/src/components/panes/configure-panes/keycode.tsx
@@ -28,7 +28,9 @@ import {
   getSelectedDefinition,
   getSelectedKeyDefinitions,
 } from 'src/store/definitionsSlice';
-import {getSelectedConnectedDevice} from 'src/store/devicesSlice';
+import {getSelectedConnectedDevice,
+        getSelectedKeyboardAPI,
+} from 'src/store/devicesSlice';
 import {
   getSelectedKey,
   getSelectedKeymap,
@@ -114,8 +116,8 @@ const KeycodeDesc = styled.div`
   }
 `;
 
-const generateKeycodeCategories = (basicKeyToByte: Record<string, number>) =>
-  getKeycodes().concat(getOtherMenu(basicKeyToByte));
+const generateKeycodeCategories = (basicKeyToByte: Record<string, number>, numMacros: number = 16) =>
+  getKeycodes(numMacros).concat(getOtherMenu(basicKeyToByte));
 
 const maybeFilter = <M extends Function>(maybe: boolean, filter: M) =>
   maybe ? () => true : filter;
@@ -147,9 +149,21 @@ export const KeycodePane: FC = () => {
   const disableFastRemap = useAppSelector(getDisableFastRemap);
   const selectedKeyDefinitions = useAppSelector(getSelectedKeyDefinitions);
   const {basicKeyToByte} = useAppSelector(getBasicKeyToByte);
+  const [numMacros, setNumMacros] = useState(16);
+  
+  const api = useAppSelector(getSelectedKeyboardAPI);
+  if (!api) {
+    return null;
+  }
+  api.getMacroCount().then((nMacros) =>{
+    setNumMacros(nMacros);
+    console.log("numMacros: ", numMacros);
+  })
+  // let numMacros = async() => await new Promise(resolve => api.getMacroCount());
+
   const KeycodeCategories = useMemo(
-    () => generateKeycodeCategories(basicKeyToByte),
-    [basicKeyToByte],
+    () => generateKeycodeCategories(basicKeyToByte, numMacros),
+    [basicKeyToByte, numMacros],
   );
 
   // TODO: improve typing so we can get rid of this
diff --git a/src/utils/key-to-byte/v12.ts b/src/utils/key-to-byte/v12.ts
index 346727db..0f251280 100644
--- a/src/utils/key-to-byte/v12.ts
+++ b/src/utils/key-to-byte/v12.ts
@@ -26,7 +26,7 @@ export default {
   _QK_LAYER_TAP_TOGGLE_MAX: 0x52df,
   _QK_LAYER_MOD_MASK: 0x1f,
   _QK_MACRO: 0x7700,
-  _QK_MACRO_MAX: 0x770f,
+  _QK_MACRO_MAX: 0x777f,
   _QK_KB: 0x7e00,
   _QK_KB_MAX: 0x7eff,
   KC_NO: 0x0000,
diff --git a/src/utils/key.ts b/src/utils/key.ts
index 3131d17c..d8f76b04 100644
--- a/src/utils/key.ts
+++ b/src/utils/key.ts
@@ -464,7 +464,23 @@ function buildLayerMenu(): IKeycodeMenu {
   };
 }
 
-export function getKeycodes(): IKeycodeMenu[] {
+function generateMacros(numMacros: number = 16): IKeycode[] {
+  const macroTemplate: IKeycode = {name: 'M0', code: 'MACRO(0)', title: 'Macro 0'};
+  let res: IKeycode[] = [];
+  for (let idx = 0; idx < numMacros; idx++) {
+    const newName = `M(${idx})`;
+    const newCode = `MACRO(${idx})`;
+    const newTitle = `Macro ${idx}`;
+    res = [
+      ...res,
+      {name: newName, title: newTitle, code: newCode},
+    ];
+  }
+  return res;
+}
+
+
+export function getKeycodes(numMacros = 16): IKeycodeMenu[] {
   return [
     {
       id: 'basic',
@@ -734,24 +750,7 @@ export function getKeycodes(): IKeycodeMenu[] {
       id: 'macro',
       label: 'Macro',
       width: 'label',
-      keycodes: [
-        {name: 'M0', code: 'MACRO(0)', title: 'Macro 0'},
-        {name: 'M1', code: 'MACRO(1)', title: 'Macro 1'},
-        {name: 'M2', code: 'MACRO(2)', title: 'Macro 2'},
-        {name: 'M3', code: 'MACRO(3)', title: 'Macro 3'},
-        {name: 'M4', code: 'MACRO(4)', title: 'Macro 4'},
-        {name: 'M5', code: 'MACRO(5)', title: 'Macro 5'},
-        {name: 'M6', code: 'MACRO(6)', title: 'Macro 6'},
-        {name: 'M7', code: 'MACRO(7)', title: 'Macro 7'},
-        {name: 'M8', code: 'MACRO(8)', title: 'Macro 8'},
-        {name: 'M9', code: 'MACRO(9)', title: 'Macro 9'},
-        {name: 'M10', code: 'MACRO(10)', title: 'Macro 10'},
-        {name: 'M11', code: 'MACRO(11)', title: 'Macro 11'},
-        {name: 'M12', code: 'MACRO(12)', title: 'Macro 12'},
-        {name: 'M13', code: 'MACRO(13)', title: 'Macro 13'},
-        {name: 'M14', code: 'MACRO(14)', title: 'Macro 14'},
-        {name: 'M15', code: 'MACRO(15)', title: 'Macro 15'},
-      ],
+      keycodes: generateMacros(numMacros)
     },
     buildLayerMenu(),
     {