diff --git a/src/background/menus.mjs b/src/background/menus.mjs
index a92bd7ba..b75ebc29 100644
--- a/src/background/menus.mjs
+++ b/src/background/menus.mjs
@@ -19,6 +19,12 @@ const onClickMenu = (info, tab) => {
         type: 'CREATE_CHAT',
         data: message,
       })
+    } else if (message.itemId.startsWith('custom_')) {
+      // Handle custom selection tools
+      Browser.tabs.sendMessage(currentTab.id, {
+        type: 'CREATE_CHAT',
+        data: message,
+      })
     } else if (message.itemId in menuConfig) {
       if (menuConfig[message.itemId].action) {
         menuConfig[message.itemId].action(true, tab)
@@ -37,7 +43,8 @@ export function refreshMenu() {
   if (Browser.contextMenus.onClicked.hasListener(onClickMenu))
     Browser.contextMenus.onClicked.removeListener(onClickMenu)
   Browser.contextMenus.removeAll().then(async () => {
-    if ((await getUserConfig()).hideContextMenu) return
+    const userConfig = await getUserConfig()
+    if (userConfig.hideContextMenu) return
 
     await getPreferredLanguageKey().then((lang) => {
       changeLanguage(lang)
@@ -62,17 +69,33 @@ export function refreshMenu() {
       contexts: ['selection'],
       type: 'separator',
     })
+
+    // Add default selection tools that are active
     for (const index in defaultConfig.selectionTools) {
       const key = defaultConfig.selectionTools[index]
       const desc = defaultConfig.selectionToolsDesc[index]
-      Browser.contextMenus.create({
-        id: menuId + key,
-        parentId: menuId,
-        title: t(desc),
-        contexts: ['selection'],
-      })
+      if (userConfig.activeSelectionTools.includes(key)) {
+        Browser.contextMenus.create({
+          id: menuId + key,
+          parentId: menuId,
+          title: t(desc),
+          contexts: ['selection'],
+        })
+      }
     }
 
+    // Add custom selection tools that are active
+    userConfig.customSelectionTools?.forEach((tool, i) => {
+      if (tool?.active && tool?.name) {
+        Browser.contextMenus.create({
+          id: menuId + 'custom_' + i,
+          parentId: menuId,
+          title: tool.name,
+          contexts: ['selection'],
+        })
+      }
+    })
+
     Browser.contextMenus.onClicked.addListener(onClickMenu)
   })
 }
diff --git a/src/content-script/index.jsx b/src/content-script/index.jsx
index 01b0b3aa..626d0203 100644
--- a/src/content-script/index.jsx
+++ b/src/content-script/index.jsx
@@ -284,8 +284,19 @@ async function prepareForRightClickMenu() {
     if (message.type === 'CREATE_CHAT') {
       const data = message.data
       let prompt = ''
+      const userConfig = await getUserConfig()
+
       if (data.itemId in toolsConfig) {
         prompt = await toolsConfig[data.itemId].genPrompt(data.selectionText)
+      } else if (data.itemId.startsWith('custom_')) {
+        // Handle custom selection tools from context menu
+        const customIndex = parseInt(data.itemId.replace('custom_', ''), 10)
+        if (!isNaN(customIndex) && customIndex >= 0) {
+          const customTool = userConfig.customSelectionTools?.[customIndex]
+          if (customTool?.active && customTool?.name) {
+            prompt = customTool.prompt.replace('{{selection}}', data.selectionText)
+          }
+        }
       } else if (data.itemId in menuConfig) {
         const menuItem = menuConfig[data.itemId]
         if (!menuItem.genPrompt) return
@@ -298,7 +309,6 @@ async function prepareForRightClickMenu() {
         : { x: window.innerWidth / 2 - 300, y: window.innerHeight / 2 - 200 }
       const container = createElementAtPosition(position.x, position.y)
       container.className = 'chatgptbox-toolbar-container-not-queryable'
-      const userConfig = await getUserConfig()
       render(
         <FloatingToolbar
           session={initSession({
diff --git a/src/popup/sections/SelectionTools.jsx b/src/popup/sections/SelectionTools.jsx
index a166246e..81962b07 100644
--- a/src/popup/sections/SelectionTools.jsx
+++ b/src/popup/sections/SelectionTools.jsx
@@ -4,6 +4,7 @@ import PropTypes from 'prop-types'
 import { useState } from 'react'
 import { defaultConfig } from '../../config/index.mjs'
 import { PencilIcon, TrashIcon } from '@primer/octicons-react'
+import Browser from 'webextension-polyfill'
 
 SelectionTools.propTypes = {
   config: PropTypes.object.isRequired,
@@ -17,6 +18,13 @@ const defaultTool = {
   active: true,
 }
 
+// Helper function to refresh context menu
+const refreshContextMenu = () => {
+  Browser.runtime.sendMessage({
+    type: 'REFRESH_MENU',
+  })
+}
+
 export function SelectionTools({ config, updateConfig }) {
   const { t } = useTranslation()
   const [editing, setEditing] = useState(false)
@@ -36,7 +44,7 @@ export function SelectionTools({ config, updateConfig }) {
           {t('Cancel')}
         </button>
         <button
-          onClick={(e) => {
+          onClick={async (e) => {
             e.preventDefault()
             if (!editingTool.name) {
               setErrorMessage(t('Name is required'))
@@ -47,14 +55,15 @@ export function SelectionTools({ config, updateConfig }) {
               return
             }
             if (editingIndex === -1) {
-              updateConfig({
+              await updateConfig({
                 customSelectionTools: [...config.customSelectionTools, editingTool],
               })
             } else {
               const customSelectionTools = [...config.customSelectionTools]
               customSelectionTools[editingIndex] = editingTool
-              updateConfig({ customSelectionTools })
+              await updateConfig({ customSelectionTools })
             }
+            refreshContextMenu()
             setEditing(false)
           }}
         >
@@ -102,11 +111,12 @@ export function SelectionTools({ config, updateConfig }) {
           <input
             type="checkbox"
             checked={config.activeSelectionTools.includes(key)}
-            onChange={(e) => {
+            onChange={async (e) => {
               const checked = e.target.checked
               const activeSelectionTools = config.activeSelectionTools.filter((i) => i !== key)
               if (checked) activeSelectionTools.push(key)
-              updateConfig({ activeSelectionTools })
+              await updateConfig({ activeSelectionTools })
+              refreshContextMenu()
             }}
           />
           {t(toolsConfig[key].label)}
@@ -122,10 +132,11 @@ export function SelectionTools({ config, updateConfig }) {
               <input
                 type="checkbox"
                 checked={tool.active}
-                onChange={(e) => {
+                onChange={async (e) => {
                   const customSelectionTools = [...config.customSelectionTools]
                   customSelectionTools[index] = { ...tool, active: e.target.checked }
-                  updateConfig({ customSelectionTools })
+                  await updateConfig({ customSelectionTools })
+                  refreshContextMenu()
                 }}
               />
               {tool.name}
@@ -145,11 +156,12 @@ export function SelectionTools({ config, updateConfig }) {
                 </div>
                 <div
                   style={{ cursor: 'pointer' }}
-                  onClick={(e) => {
+                  onClick={async (e) => {
                     e.preventDefault()
                     const customSelectionTools = [...config.customSelectionTools]
                     customSelectionTools.splice(index, 1)
-                    updateConfig({ customSelectionTools })
+                    await updateConfig({ customSelectionTools })
+                    refreshContextMenu()
                   }}
                 >
                   <TrashIcon />