diff --git a/src/client/components/SettingsModal/Shortcut.tsx b/src/client/components/SettingsModal/Shortcut.tsx
index f2245fc3..9016fb47 100644
--- a/src/client/components/SettingsModal/Shortcut.tsx
+++ b/src/client/components/SettingsModal/Shortcut.tsx
@@ -1,16 +1,157 @@
-import React from 'react'
+import React, { useEffect } from 'react'
+import { useDispatch } from 'react-redux'
+import { v4 as uuid } from 'uuid'
+import { RefreshCw } from 'react-feather'
+
+import { updateShortcut } from '@/slices/settings'
+import { ShortcutItem } from '@/types'
 
 export interface ShortcutProps {
   action: string
-  letter: string
+  shortcut: string
+  id: number
+  originalKey: string
+  shortcuts: ShortcutItem[]
 }
 
-export const Shortcut: React.FC<ShortcutProps> = ({ action, letter }) => {
+export const Shortcut: React.FC<ShortcutProps> = ({
+  action,
+  shortcut,
+  id,
+  originalKey,
+  shortcuts,
+}) => {
+  const [newShortcut, setNewShortcut] = React.useState<string>('')
+  const [currentShortcut, setCurrentShortcut] = React.useState<string>(shortcut)
+  const [editShortcut, setEditShortcut] = React.useState<boolean>(false)
+
+  // ===========================================================================
+  // Dispatch
+  // ===========================================================================
+
+  const dispatch = useDispatch()
+
+  const _updateShortcut = (newShortcut: string) =>
+    dispatch(
+      updateShortcut({
+        action,
+        key: shortcut,
+        newShortcut: newShortcut,
+        id: id,
+        originalKey: originalKey,
+      })
+    )
+
+  const _resetShortcut = () =>
+    dispatch(
+      updateShortcut({
+        action,
+        key: shortcut,
+        newShortcut: originalKey,
+        id: id,
+        originalKey: originalKey,
+      })
+    )
+
+  // ===========================================================================
+  // Hooks
+  // ===========================================================================
+
+  useEffect(() => {
+    if (newShortcut !== '') {
+      _updateShortcut(newShortcut)
+      setCurrentShortcut(newShortcut)
+    }
+    if (!editShortcut) {
+      return document.removeEventListener('keydown', handleKeyDown)
+    }
+
+    return () => document.removeEventListener('keydown', handleKeyDown)
+  }, [editShortcut])
+
+  useEffect(() => {
+    const shortcutItem = shortcuts.find((item) => item.id === id)
+    if (shortcutItem) {
+      setCurrentShortcut(shortcutItem.key)
+    }
+  }, [shortcuts])
+
+  function handleKeyDown(e): void {
+    e.preventDefault() // Prevent default browser behavior for the shortcut key
+
+    const key = e.key.replace('Control', 'ctrl')
+    if (key === 'Backspace') {
+      return setNewShortcut((prevShortcut) => prevShortcut.split('+').slice(0, -1).join('+'))
+    }
+
+    if (key === 'Enter') {
+      if (newShortcut === '') {
+        setEditShortcut(false)
+
+        return setNewShortcut(shortcut)
+      }
+      setCurrentShortcut(newShortcut)
+      setEditShortcut(false)
+
+      return document.removeEventListener('keydown', handleKeyDown)
+    }
+    setNewShortcut((prevShortcut) => {
+      if (prevShortcut.split('+').length < 3) {
+        return prevShortcut === '' ? key : `${prevShortcut}+${key}`
+      }
+
+      return prevShortcut
+    })
+  }
+
   return (
     <div className="settings-shortcut">
       <div>{action}</div>
-      <div className="keys">
-        <kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>{letter}</kbd>
+      <div className="keys" onDoubleClick={() => setEditShortcut(!editShortcut)}>
+        {!editShortcut ? (
+          <div>
+            {currentShortcut.split('+').map((key, index) => {
+              return (
+                <React.Fragment key={uuid()}>
+                  <kbd>{key.toUpperCase()}</kbd>
+                  {index !== currentShortcut.split('+').length - 1 && <span> + </span>}
+                </React.Fragment>
+              )
+            })}
+          </div>
+        ) : (
+          <div>
+            <kbd>
+              <input
+                onChange={() => {}}
+                value={newShortcut.split('+').join(' + ')}
+                className="shortcut-edit-input"
+                onBlur={() => {
+                  if (editShortcut) {
+                    setNewShortcut('')
+                    setCurrentShortcut(shortcut)
+                    setEditShortcut(false)
+
+                    return document.removeEventListener('keydown', handleKeyDown)
+                  }
+                }}
+                onFocus={() => {
+                  setNewShortcut('')
+                  document.addEventListener('keydown', handleKeyDown)
+                }}
+              />
+            </kbd>
+          </div>
+        )}
+
+        <RefreshCw
+          aria-hidden="true"
+          size={12}
+          onClick={() => {
+            setCurrentShortcut(originalKey)
+            _resetShortcut()
+          }}
+        />
       </div>
     </div>
   )
diff --git a/src/client/components/Tabs/Tab.tsx b/src/client/components/Tabs/Tab.tsx
index 02e081a1..6b2c4bdb 100644
--- a/src/client/components/Tabs/Tab.tsx
+++ b/src/client/components/Tabs/Tab.tsx
@@ -4,15 +4,22 @@ import { Icon } from 'react-feather'
 export interface TabProps {
   label: string
   activeTab: string
+  testId?: string
   onClick: (label: string) => void
   icon: Icon
 }
 
-export const Tab: React.FC<TabProps> = ({ activeTab, label, icon: IconCmp, onClick }) => {
+export const Tab: React.FC<TabProps> = ({ activeTab, label, testId, icon: IconCmp, onClick }) => {
   const className = activeTab === label ? 'tab active' : 'tab'
 
   return (
-    <div role="button" key={label} className={className} onClick={() => onClick(label)}>
+    <div
+      role="button"
+      key={label}
+      data-testid={testId}
+      className={className}
+      onClick={() => onClick(label)}
+    >
       <IconCmp size={18} className="mr-1" aria-hidden="true" focusable="false" /> {label}
     </div>
   )
diff --git a/src/client/components/Tabs/TabPanel.tsx b/src/client/components/Tabs/TabPanel.tsx
index f4e0aeb5..3c61f3b6 100644
--- a/src/client/components/Tabs/TabPanel.tsx
+++ b/src/client/components/Tabs/TabPanel.tsx
@@ -4,6 +4,7 @@ import { Icon } from 'react-feather'
 export interface TabPanelProps {
   label: string
   icon: Icon
+  testId?: string
   children: JSX.Element[] | JSX.Element
 }
 
diff --git a/src/client/components/Tabs/Tabs.tsx b/src/client/components/Tabs/Tabs.tsx
index dd1e1fb9..57c1bf53 100644
--- a/src/client/components/Tabs/Tabs.tsx
+++ b/src/client/components/Tabs/Tabs.tsx
@@ -13,7 +13,7 @@ export const Tabs: React.FC<TabsProps> = ({ children }) => {
     <div className="tabs">
       <nav className="tab-list">
         {children.map((child) => {
-          const { label, icon } = child.props
+          const { label, icon, testId } = child.props
 
           return (
             <Tab
@@ -22,6 +22,7 @@ export const Tabs: React.FC<TabsProps> = ({ children }) => {
               key={label}
               label={label}
               onClick={setActiveTab}
+              testId={testId}
             />
           )
         })}
diff --git a/src/client/containers/KeyboardShortcuts.tsx b/src/client/containers/KeyboardShortcuts.tsx
index 60591dff..3bc7a922 100644
--- a/src/client/containers/KeyboardShortcuts.tsx
+++ b/src/client/containers/KeyboardShortcuts.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import prettier from 'prettier/standalone'
 import parserMarkdown from 'prettier/parser-markdown'
@@ -19,6 +19,7 @@ import { sync } from '@/slices/sync'
 import { getCategories, getNotes, getSettings } from '@/selectors'
 import { CategoryItem, NoteItem } from '@/types'
 import { toggleDarkTheme, togglePreviewMarkdown, updateCodeMirrorOption } from '@/slices/settings'
+import { shortcutMap } from '@/utils/constants'
 
 export const KeyboardShortcuts: React.FC = () => {
   // ===========================================================================
@@ -26,10 +27,9 @@ export const KeyboardShortcuts: React.FC = () => {
   // ===========================================================================
 
   const { categories } = useSelector(getCategories)
-  const { activeCategoryId, activeFolder, activeNoteId, notes, selectedNotesIds } = useSelector(
-    getNotes
-  )
-  const { darkTheme, previewMarkdown } = useSelector(getSettings)
+  const { activeCategoryId, activeFolder, activeNoteId, notes, selectedNotesIds } =
+    useSelector(getNotes)
+  const { darkTheme, previewMarkdown, shortcuts } = useSelector(getSettings)
 
   const activeNote = getActiveNote(notes, activeNoteId)
 
@@ -47,7 +47,13 @@ export const KeyboardShortcuts: React.FC = () => {
   const _swapFolder = (folder: Folder) => dispatch(swapFolder({ folder }))
   const _toggleTrashNotes = (noteId: string) => dispatch(toggleTrashNotes(noteId))
   const _sync = (notes: NoteItem[], categories: CategoryItem[]) =>
-    dispatch(sync({ notes, categories }))
+    dispatch(
+      sync({
+        notes,
+        categories,
+        shortcuts,
+      })
+    )
   const _togglePreviewMarkdown = () => dispatch(togglePreviewMarkdown())
   const _toggleDarkTheme = () => dispatch(toggleDarkTheme())
   const _updateCodeMirrorOption = (key: string, value: string) =>
@@ -113,14 +119,16 @@ export const KeyboardShortcuts: React.FC = () => {
   // Hooks
   // ===========================================================================
 
-  useKey(Shortcuts.NEW_NOTE, () => newNoteHandler())
-  useKey(Shortcuts.NEW_CATEGORY, () => newTempCategoryHandler())
-  useKey(Shortcuts.DELETE_NOTE, () => trashNoteHandler())
-  useKey(Shortcuts.SYNC_NOTES, () => syncNotesHandler())
-  useKey(Shortcuts.DOWNLOAD_NOTES, () => downloadNotesHandler())
-  useKey(Shortcuts.PREVIEW, () => togglePreviewMarkdownHandler())
-  useKey(Shortcuts.TOGGLE_THEME, () => toggleDarkThemeHandler())
-  useKey(Shortcuts.PRETTIFY, () => prettifyNoteHandler())
+  const sortedShortcuts = [...shortcuts].sort((a, b) => a.id - b.id)
+
+  useKey(sortedShortcuts[0].key, () => newNoteHandler())
+  useKey(sortedShortcuts[1].key, () => trashNoteHandler())
+  useKey(sortedShortcuts[2].key, () => newTempCategoryHandler())
+  useKey(sortedShortcuts[3].key, () => downloadNotesHandler())
+  useKey(sortedShortcuts[4].key, () => syncNotesHandler())
+  useKey(sortedShortcuts[6].key, () => togglePreviewMarkdownHandler())
+  useKey(sortedShortcuts[7].key, () => toggleDarkThemeHandler())
+  useKey(sortedShortcuts[9].key, () => prettifyNoteHandler())
 
   return null
 }
diff --git a/src/client/containers/NoteMenuBar.tsx b/src/client/containers/NoteMenuBar.tsx
index a4c2b818..94eb03c5 100644
--- a/src/client/containers/NoteMenuBar.tsx
+++ b/src/client/containers/NoteMenuBar.tsx
@@ -16,7 +16,7 @@ import {
 
 import { TestID } from '@resources/TestID'
 import { LastSyncedNotification } from '@/components/LastSyncedNotification'
-import { NoteItem, CategoryItem } from '@/types'
+import { NoteItem, CategoryItem, ShortcutItem } from '@/types'
 import {
   toggleSettingsModal,
   togglePreviewMarkdown,
@@ -36,7 +36,7 @@ export const NoteMenuBar = () => {
   const { notes, activeNoteId } = useSelector(getNotes)
   const { categories } = useSelector(getCategories)
   const { syncing, lastSynced, pendingSync } = useSelector(getSync)
-  const { darkTheme } = useSelector(getSettings)
+  const { darkTheme, shortcuts } = useSelector(getSettings)
 
   // ===========================================================================
   // Other
@@ -77,8 +77,8 @@ export const NoteMenuBar = () => {
   const _togglePreviewMarkdown = () => dispatch(togglePreviewMarkdown())
   const _toggleTrashNotes = (noteId: string) => dispatch(toggleTrashNotes(noteId))
   const _toggleFavoriteNotes = (noteId: string) => dispatch(toggleFavoriteNotes(noteId))
-  const _sync = (notes: NoteItem[], categories: CategoryItem[]) =>
-    dispatch(sync({ notes, categories }))
+  const _sync = (notes: NoteItem[], categories: CategoryItem[], shortcuts: ShortcutItem[]) =>
+    dispatch(sync({ notes, categories, shortcuts }))
   const _toggleSettingsModal = () => dispatch(toggleSettingsModal())
   const _toggleDarkTheme = () => dispatch(toggleDarkTheme())
   const _updateCodeMirrorOption = (key: string, value: any) =>
@@ -91,7 +91,7 @@ export const NoteMenuBar = () => {
   const downloadNotesHandler = () => downloadNotes([activeNote], categories)
   const favoriteNoteHandler = () => _toggleFavoriteNotes(activeNoteId)
   const trashNoteHandler = () => _toggleTrashNotes(activeNoteId)
-  const syncNotesHandler = () => _sync(notes, categories)
+  const syncNotesHandler = () => _sync(notes, categories, shortcuts)
   const settingsHandler = () => _toggleSettingsModal()
   const toggleDarkThemeHandler = () => {
     _toggleDarkTheme()
diff --git a/src/client/containers/SettingsModal.tsx b/src/client/containers/SettingsModal.tsx
index e8da1de0..5b22b14a 100644
--- a/src/client/containers/SettingsModal.tsx
+++ b/src/client/containers/SettingsModal.tsx
@@ -9,6 +9,7 @@ import {
   Download,
   DownloadCloud,
   UploadCloud,
+  RefreshCw,
 } from 'react-feather'
 
 import {
@@ -17,12 +18,13 @@ import {
   togglePreviewMarkdown,
   toggleDarkTheme,
   updateNotesSortStrategy,
+  resetAllShortcuts,
 } from '@/slices/settings'
 import { updateNotes, importNotes } from '@/slices/note'
 import { logout } from '@/slices/auth'
 import { importCategories } from '@/slices/category'
-import { shortcutMap, notesSortOptions, directionTextOptions } from '@/utils/constants'
-import { CategoryItem, NoteItem, ReactMouseEvent } from '@/types'
+import { notesSortOptions, directionTextOptions } from '@/utils/constants'
+import { CategoryItem, NoteItem, ReactMouseEvent, ShortcutItem } from '@/types'
 import { getSettings, getAuth, getNotes, getCategories } from '@/selectors'
 import { Option } from '@/components/SettingsModal/Option'
 import { Shortcut } from '@/components/SettingsModal/Shortcut'
@@ -36,14 +38,13 @@ import { LabelText } from '@resources/LabelText'
 import { TestID } from '@resources/TestID'
 import { IconButtonUploader } from '@/components/SettingsModal/IconButtonUploader'
 
-export const SettingsModal: React.FC = () => {
+export const SettingsModal: React.FC = ({ showModal }: { showModal?: boolean }) => {
   // ===========================================================================
   // Selectors
   // ===========================================================================
 
-  const { codeMirrorOptions, isOpen, previewMarkdown, darkTheme, notesSortKey } = useSelector(
-    getSettings
-  )
+  let { codeMirrorOptions, isOpen, previewMarkdown, darkTheme, notesSortKey, shortcuts } =
+    useSelector(getSettings)
   const { currentUser } = useSelector(getAuth)
   const { notes, activeFolder, activeCategoryId } = useSelector(getNotes)
   const { categories } = useSelector(getCategories)
@@ -68,6 +69,7 @@ export const SettingsModal: React.FC = () => {
     dispatch(importNotes(notes))
     dispatch(importCategories(categories))
   }
+  const _resetAllShortcuts = () => dispatch(resetAllShortcuts())
 
   // ===========================================================================
   // Refs
@@ -125,6 +127,7 @@ export const SettingsModal: React.FC = () => {
 
     _importBackup(notes, categories)
   }
+
   // ===========================================================================
   // Hooks
   // ===========================================================================
@@ -138,6 +141,9 @@ export const SettingsModal: React.FC = () => {
       document.removeEventListener('keydown', handleEscPress)
     }
   })
+  if (showModal !== undefined) {
+    isOpen = showModal
+  }
 
   return isOpen ? (
     <div className="dimmer">
@@ -227,10 +233,30 @@ export const SettingsModal: React.FC = () => {
                 testId={TestID.TEXT_DIRECTION_DROPDOWN}
               />
             </TabPanel>
-            <TabPanel label="Keyboard shortcuts" icon={Command}>
-              {shortcutMap.map((shortcut) => (
-                <Shortcut action={shortcut.action} letter={shortcut.key} key={shortcut.key} />
-              ))}
+            <TabPanel
+              label="Keyboard shortcuts"
+              icon={Command}
+              testId={'settings-modal-shortcut-tab'}
+            >
+              <>
+                {shortcuts.map((shortcut, index) => (
+                  <Shortcut
+                    action={shortcut.action || ''}
+                    key={shortcut.id}
+                    id={shortcut.id}
+                    shortcut={shortcut.key}
+                    originalKey={shortcut.originalKey}
+                    shortcuts={shortcuts}
+                  />
+                ))}
+              </>
+              <p>Reset all shortcuts to their original keys.</p>
+              <IconButton
+                dataTestID={TestID.SETTINGS_MODAL_DOWNLOAD_NOTES}
+                handler={_resetAllShortcuts}
+                icon={RefreshCw}
+                text={LabelText.RESET_ALL_SHORTCUTS}
+              />
             </TabPanel>
             <TabPanel label="Data management" icon={Archive}>
               <p>Download all notes as Markdown files in a zip.</p>
diff --git a/src/client/slices/note.ts b/src/client/slices/note.ts
index 04c61588..ae420280 100644
--- a/src/client/slices/note.ts
+++ b/src/client/slices/note.ts
@@ -2,7 +2,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 import { v4 as uuid } from 'uuid'
 
 import { Folder, NotesSortKey } from '@/utils/enums'
-import { NoteItem, NoteState } from '@/types'
+import { NoteItem, NoteState, ShortcutItem } from '@/types'
 import { isDraftNote } from '@/utils/helpers'
 import { getNotesSorter } from '@/utils/notesSortStrategies'
 
diff --git a/src/client/slices/settings.ts b/src/client/slices/settings.ts
index fbec5137..6ccb9eeb 100644
--- a/src/client/slices/settings.ts
+++ b/src/client/slices/settings.ts
@@ -1,13 +1,15 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
-import { SettingsState } from '@/types'
+import { SettingsState, ShortcutItem } from '@/types'
 import { NotesSortKey, DirectionText } from '@/utils/enums'
+import { shortcutMap } from '@/utils/constants'
 
 export const initialState: SettingsState = {
   previewMarkdown: false,
   darkTheme: false,
   sidebarVisible: true,
   notesSortKey: NotesSortKey.LAST_UPDATED,
+  shortcuts: shortcutMap,
   codeMirrorOptions: {
     mode: 'gfm',
     theme: 'base16-light',
@@ -59,6 +61,43 @@ const settingsSlice = createSlice({
     loadSettingsSuccess: (state, { payload }: PayloadAction<SettingsState>) => {
       return { ...payload, loading: false }
     },
+    updateShortcut: (
+      state,
+      {
+        payload,
+      }: PayloadAction<
+        ShortcutItem & {
+          newShortcut: string
+        }
+      >
+    ) => {
+      if (!state.shortcuts) {
+        state.shortcuts = shortcutMap
+      }
+
+      const updatedShortcuts = state.shortcuts.map((shortcut) => {
+        if (shortcut.key === payload.key) {
+          return {
+            ...shortcut,
+            key: payload.newShortcut.toLowerCase(),
+          }
+        }
+
+        return shortcut
+      })
+
+      return {
+        ...state,
+        shortcuts: updatedShortcuts,
+      }
+    },
+
+    resetAllShortcuts: (state) => {
+      return {
+        ...state,
+        shortcuts: shortcutMap,
+      }
+    },
   },
 })
 
@@ -71,6 +110,8 @@ export const {
   loadSettings,
   loadSettingsError,
   loadSettingsSuccess,
+  updateShortcut,
+  resetAllShortcuts,
 } = settingsSlice.actions
 
 export default settingsSlice.reducer
diff --git a/src/client/styles/_modal.scss b/src/client/styles/_modal.scss
index 425a1638..80354dc8 100644
--- a/src/client/styles/_modal.scss
+++ b/src/client/styles/_modal.scss
@@ -75,6 +75,29 @@
       font-size: 0.95rem;
       .keys {
         width: 180px;
+        white-space: nowrap;
+        display: flex;
+        align-items: center;
+        justify-content: flex-start;
+
+        svg {
+          margin-left: auto;
+          &:hover {
+            stroke: lighten($app-sidebar-color, 60%);
+          }
+        }
+
+        .shortcut-edit-input {
+          width: 120px;
+          border: none;
+          outline: transparent;
+          background: transparent;
+          text-transform: uppercase;
+          font-size: 12px;
+          line-height: 1.4;
+          color: inherit;
+          text-shadow: inherit;
+        }
       }
     }
 
diff --git a/src/client/types/index.ts b/src/client/types/index.ts
index ee3434bf..e6502af8 100644
--- a/src/client/types/index.ts
+++ b/src/client/types/index.ts
@@ -27,6 +27,13 @@ export interface CategoryItem {
   draggedOver: boolean
 }
 
+export interface ShortcutItem {
+  action: string
+  key: string
+  originalKey: string
+  id: number
+}
+
 export interface GithubUser {
   [anyProp: string]: any
 }
@@ -70,6 +77,7 @@ export interface SettingsState {
   darkTheme: boolean
   sidebarVisible: boolean
   notesSortKey: NotesSortKey
+  shortcuts: ShortcutItem[]
   codeMirrorOptions: { [key: string]: any }
 }
 
@@ -95,6 +103,7 @@ export interface RootState {
 export interface SyncPayload {
   categories: CategoryItem[]
   notes: NoteItem[]
+  shortcuts: ShortcutItem[]
 }
 
 export interface SyncAction {
diff --git a/src/client/utils/constants.ts b/src/client/utils/constants.ts
index e3177eee..6f6963c8 100644
--- a/src/client/utils/constants.ts
+++ b/src/client/utils/constants.ts
@@ -1,4 +1,5 @@
-import { Folder, NotesSortKey, DirectionText } from '@/utils/enums'
+import { ShortcutItem } from '@/types'
+import { Folder, NotesSortKey, DirectionText, Shortcuts } from '@/utils/enums'
 
 export const folderMap: Record<Folder, string> = {
   [Folder.ALL]: 'All Notes',
@@ -11,15 +12,16 @@ export const folderMap: Record<Folder, string> = {
 export const iconColor = 'rgba(255, 255, 255, 0.25)'
 
 export const shortcutMap = [
-  { action: 'Create a new note', key: 'N' },
-  { action: 'Delete a note', key: 'U' },
-  { action: 'Create a category', key: 'C' },
-  { action: 'Download a note', key: 'O' },
-  { action: 'Sync all notes', key: 'L' },
-  { action: 'Markdown preview', key: 'P' },
-  { action: 'Toggle theme', key: 'K' },
-  { action: 'Search notes', key: 'F' },
-  { action: 'Prettify a note', key: 'I' },
+  { id: 1, action: 'Create a new note', key: 'ctrl+alt+n', originalKey: Shortcuts.NEW_NOTE },
+  { id: 2, action: 'Delete a note', key: 'ctrl+alt+u', originalKey: Shortcuts.DELETE_NOTE },
+  { id: 3, action: 'Create a category', key: 'ctrl+alt+c', originalKey: Shortcuts.NEW_CATEGORY },
+  { id: 4, action: 'Download a note', key: 'ctrl+alt+o', originalKey: Shortcuts.DOWNLOAD_NOTES },
+  { id: 5, action: 'Sync all notes', key: 'ctrl+alt+l', originalKey: Shortcuts.SYNC_NOTES },
+  { id: 6, action: 'Toggle sidebar', key: 'ctrl+alt+s', originalKey: Shortcuts.TOGGLE_SIDEBAR },
+  { id: 7, action: 'Markdown preview', key: 'ctrl+alt+p', originalKey: Shortcuts.PREVIEW },
+  { id: 8, action: 'Toggle theme', key: 'ctrl+alt+k', originalKey: Shortcuts.TOGGLE_THEME },
+  { id: 9, action: 'Search notes', key: 'ctrl+alt+f', originalKey: Shortcuts.SEARCH },
+  { id: 10, action: 'Prettify a note', key: 'ctrl+alt+i', originalKey: Shortcuts.PRETTIFY },
 ]
 
 export const notesSortOptions = [
diff --git a/src/client/utils/enums.ts b/src/client/utils/enums.ts
index 5b58ef19..a73822c7 100644
--- a/src/client/utils/enums.ts
+++ b/src/client/utils/enums.ts
@@ -12,10 +12,11 @@ export enum Shortcuts {
   DELETE_NOTE = 'ctrl+alt+u',
   SYNC_NOTES = 'ctrl+alt+l',
   DOWNLOAD_NOTES = 'ctrl+alt+o',
-  PREVIEW = 'alt+ctrl+p',
+  PREVIEW = 'ctrl+alt+p',
   TOGGLE_THEME = 'alt+ctrl+k',
   SEARCH = 'alt+ctrl+f',
   PRETTIFY = 'ctrl+alt+i',
+  TOGGLE_SIDEBAR = 'ctrl+alt+s',
 }
 
 export enum ContextMenuEnum {
diff --git a/src/resources/LabelText.ts b/src/resources/LabelText.ts
index 43d02310..1107e767 100644
--- a/src/resources/LabelText.ts
+++ b/src/resources/LabelText.ts
@@ -5,6 +5,7 @@ export enum LabelText {
   NOTES = 'Notes',
   CREATE_NEW_NOTE = 'Create new note',
   DELETE_PERMANENTLY = 'Delete permanently',
+  RESET_ALL_SHORTCUTS = 'Reset all shortcuts',
   DOWNLOAD = 'Download',
   FAVORITES = 'Favorites',
   SCRATCHPAD = 'Scratchpad',
diff --git a/src/resources/TestID.ts b/src/resources/TestID.ts
index 5f165e56..bd1e93c0 100644
--- a/src/resources/TestID.ts
+++ b/src/resources/TestID.ts
@@ -38,6 +38,7 @@ export enum TestID {
   SCRATCHPAD = 'scratchpad',
   NOTE_OPTION_ADD_CONTENT_NOTE = 'note-option-add-content-note',
   SETTINGS_MODAL_DOWNLOAD_NOTES = 'settings-modal-download-notes',
+  SETTINGS_MODAL_SHORTCUT_TAB = 'settings-modal-shortcut-tab',
   DARK_MODE_TOGGLE = 'dark-mode-toggle',
   MARKDOWN_PREVIEW_TOGGLE = 'markdown-preview-toggle',
   ACTIVE_LINE_HIGHLIGHT_TOGGLE = 'active-line-highlight-toggle',
diff --git a/src/server/handlers/auth.ts b/src/server/handlers/auth.ts
index 7651726e..c0dd4c56 100644
--- a/src/server/handlers/auth.ts
+++ b/src/server/handlers/auth.ts
@@ -95,7 +95,7 @@ export default {
 
       response.status(200).send(data)
     } catch (error) {
-      response.status(400).send({ message: error.message })
+      response.status(400).send({ message: (error as Error).message })
     }
   },
 
@@ -135,7 +135,7 @@ async function createTakeNoteDataRepo(username: string, accessToken: string): Pr
   try {
     await SDK(Method.POST, `/user/repos`, accessToken, takenoteDataRepo)
   } catch (error) {
-    throw new Error(error)
+    throw error
   }
 }
 
@@ -153,6 +153,6 @@ async function createInitialCommit(username: string, accessToken: string): Promi
       noteCommit
     )
   } catch (error) {
-    throw new Error(error)
+    throw error
   }
 }
diff --git a/src/server/handlers/sync.ts b/src/server/handlers/sync.ts
index 9e5ce15e..6aa6079d 100644
--- a/src/server/handlers/sync.ts
+++ b/src/server/handlers/sync.ts
@@ -75,7 +75,7 @@ export default {
     } catch (error) {
       response
         .status(400)
-        .send({ message: error.message || 'Something went wrong while syncing data' })
+        .send({ message: (error as Error).message || 'Something went wrong while syncing data' })
     }
   },
 
@@ -96,14 +96,14 @@ export default {
       try {
         JSON.parse(notes)
       } catch (error) {
-        response.status(400).send({ message: error.message || 'Must be valid JSON.' })
+        response.status(400).send({ message: (error as Error).message || 'Must be valid JSON.' })
       }
 
       response.status(200).send(notes)
     } catch (error) {
-      response
-        .status(400)
-        .send({ message: error.message || 'Something went wrong while fetching note data' })
+      response.status(400).send({
+        message: (error as Error).message || 'Something went wrong while fetching note data',
+      })
     }
   },
 
@@ -124,14 +124,14 @@ export default {
       try {
         JSON.parse(categories)
       } catch (error) {
-        response.status(400).send({ message: error.message || 'Must be valid JSON.' })
+        response.status(400).send({ message: (error as Error).message || 'Must be valid JSON.' })
       }
 
       response.status(200).send(categories)
     } catch (error) {
-      response
-        .status(400)
-        .send({ message: error.message || 'Something went wrong while fetching category data' })
+      response.status(400).send({
+        message: (error as Error).message || 'Something went wrong while fetching category data',
+      })
     }
   },
 }
diff --git a/tests/unit/client/components/SettingsModal/Shortcuts.test.tsx b/tests/unit/client/components/SettingsModal/Shortcuts.test.tsx
new file mode 100644
index 00000000..14b9c172
--- /dev/null
+++ b/tests/unit/client/components/SettingsModal/Shortcuts.test.tsx
@@ -0,0 +1,33 @@
+import React from 'react'
+
+import '@testing-library/jest-dom'
+import 'jest-extended'
+
+import { TestID } from '@resources/TestID'
+import { TempStateProvider } from '@/contexts/TempStateContext'
+import { SettingsModal } from '@/containers/SettingsModal'
+
+import { renderWithRouter } from '../../testHelpers'
+
+const wrap = (props: any) =>
+  renderWithRouter(
+    <TempStateProvider>
+      <SettingsModal {...props} />
+    </TempStateProvider>
+  )
+
+describe('<SettingsModal />', () => {
+  it('renders the SettingsModal component', () => {
+    const component = wrap({
+      showModal: true,
+    })
+    expect(component).toBeTruthy()
+  })
+
+  it('renders the Shortcuts Tab content and its texts', () => {
+    const component = wrap({
+      showModal: true,
+    })
+    expect(component.getByTestId(TestID.SETTINGS_MODAL_SHORTCUT_TAB)).toBeTruthy()
+  })
+})
diff --git a/tests/unit/client/testHelpers.tsx b/tests/unit/client/testHelpers.tsx
index d4d2b42e..b7ddd4c9 100644
--- a/tests/unit/client/testHelpers.tsx
+++ b/tests/unit/client/testHelpers.tsx
@@ -1,6 +1,6 @@
 import { render } from '@testing-library/react'
 import { createMemoryHistory, MemoryHistory } from 'history'
-import React, { ReactNode } from 'react'
+import React from 'react'
 import { Provider } from 'react-redux'
 import { MemoryRouter } from 'react-router-dom'
 import createSagaMiddleware from 'redux-saga'
@@ -15,7 +15,7 @@ interface RenderWithRouterOptions {
 }
 
 export const renderWithRouter = (
-  ui: ReactNode,
+  ui: React.ReactNode,
   {
     route = '/',
     history = createMemoryHistory({ initialEntries: [route] }),