diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index d390a04..2f672d1 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -197,6 +197,14 @@
     "message": "Hide Find and Replace Pane Toggle Button",
     "description": "Text displayed beside the hide find and replace toggle button option."
   },
+  "extension_option_scroll_markers_text": {
+    "message": "Show Scroll Markers",
+    "description": "Text displayed beside the scroll markers toggle option."
+  },
+  "extension_option_scroll_markers_title": {
+    "message": "If enabled, scroll markers will appear on the right edge of the page indicating the position of all matches in the document.",
+    "description": "Tooltip text for the scroll markers option description icon."
+  },
   "search_option_max_results_text": {
     "message": "Max Highlighted Results",
     "description": "Text displayed above the max highlighted results option."
diff --git a/_locales/ja/messages.json b/_locales/ja/messages.json
index 46d2109..f2b12fa 100644
--- a/_locales/ja/messages.json
+++ b/_locales/ja/messages.json
@@ -197,6 +197,14 @@
     "message": "検索と置換ボタンを非表示",
     "description": "Text displayed beside the hide find and replace toggle button option."
   },
+  "extension_option_scroll_markers_text": {
+    "message": "スクロールマーカーを表示",
+    "description": "Text displayed beside the scroll markers toggle option."
+  },
+  "extension_option_scroll_markers_title": {
+    "message": "有効時：すべての一致箇所の位置を示すスクロールマーカーがページ右端に表示されます",
+    "description": "Tooltip text for the scroll markers option description icon."
+  },
   "search_option_max_results_text": {
     "message": "最大ハイライト数",
     "description": "Text displayed above the max highlighted results option."
diff --git a/_locales/zh/messages.json b/_locales/zh/messages.json
index 7bce042..a470262 100644
--- a/_locales/zh/messages.json
+++ b/_locales/zh/messages.json
@@ -197,6 +197,14 @@
     "message": "隐藏“查找并替换”按钮",
     "description": "Text displayed beside the hide find and replace toggle button option."
   },
+  "extension_option_scroll_markers_text": {
+    "message": "显示滚动标记",
+    "description": "Text displayed beside the scroll markers toggle option."
+  },
+  "extension_option_scroll_markers_title": {
+    "message": "若启用，滚动标记将出现在页面的右边缘，指示文档中所有匹配项的位置。",
+    "description": "Tooltip text for the scroll markers option description icon."
+  },
   "search_option_max_results_text": {
     "message": "最大高亮数量",
     "description": "Text displayed above the max highlighted results option."
diff --git a/content/highlighter.js b/content/highlighter.js
index 25f2d08..10660c0 100644
--- a/content/highlighter.js
+++ b/content/highlighter.js
@@ -18,6 +18,10 @@ Find.register('Content.Highlighter', function(self) {
      * @param {object} options - The search and highlight options
      * */
     self.highlightAll = function(occurrenceMap, regex, options) {
+        if (options && options.scroll_markers) {
+            Find.Content.ScrollbarHighlightMaker.init(options);
+        }
+
         const tags = {
             occIndex: null,
             maxIndex: null,
@@ -185,6 +189,10 @@ Find.register('Content.Highlighter', function(self) {
                         inMatch = charMap[key].matched;
                         matchGroup.text += tags.openingMarkup;
                     }
+
+                    if (options && options.scroll_markers) {
+                        Find.Content.ScrollbarHighlightMaker.addOccurrence(occIndex, document.getElementById(matchGroup.groupUUID));
+                    }
                 } else {
                     if (inMatch) {
                         inMatch = charMap[key].matched;
@@ -217,6 +225,11 @@ Find.register('Content.Highlighter', function(self) {
                 }
             }
         }
+
+        if (options && options.scroll_markers) {
+            Find.Content.ScrollbarHighlightMaker.mount();
+            Find.Content.ScrollbarHighlightMaker.createMarkers();
+        }
     };
 
     /**
@@ -261,6 +274,10 @@ Find.register('Content.Highlighter', function(self) {
                 window.scrollBy(0, -100);
             }
         }
+
+        if (options.scroll_markers) {
+            Find.Content.ScrollbarHighlightMaker.setActive(index);
+        }
     };
 
     /**
@@ -331,6 +348,8 @@ Find.register('Content.Highlighter', function(self) {
      * @private
      * */
     self.restore = function() {
+        Find.Content.ScrollbarHighlightMaker.destroy();
+
         let classes = [indexHighlight, allHighlight];
         for (let classIndex = 0; classIndex < classes.length; classIndex++) {
             let els = Array.from(document.querySelectorAll('.' + classes[classIndex]));
@@ -365,4 +384,4 @@ Find.register('Content.Highlighter', function(self) {
 
         return true;
     }
-});
\ No newline at end of file
+});
diff --git a/content/scrollbar.css b/content/scrollbar.css
new file mode 100644
index 0000000..4f92937
--- /dev/null
+++ b/content/scrollbar.css
@@ -0,0 +1,87 @@
+/*
+ * Static presentational styles for the ScrollbarHighlightMaker overlay.
+ *
+ * IMPORTANT: this file must never contain the native-scrollbar suppression
+ * rules (::-webkit-scrollbar, scrollbar-width). Those rules are injected by
+ * content/scrollbar.js only while the overlay is mounted, and removed on
+ * destroy(). This file is loaded on every page at all times via the
+ * extension manifest, so anything placed here is permanently active
+ * regardless of whether find is in use. It is safe because every selector
+ * below only matches find-ext-* IDs/classes that only exist in the DOM
+ * while the overlay is mounted.
+ *
+ * Marker background colors are intentionally NOT set here, since they come
+ * from user-selected highlight color options and are applied inline by
+ * content/scrollbar.js at runtime.
+ */
+
+#find-ext-scrollbar-track {
+    position: fixed;
+    top: 0;
+    right: 0;
+    height: 100vh;
+    z-index: 2147483647;
+    pointer-events: auto;
+    background: #f1f1f1;
+    box-sizing: border-box;
+    overflow: hidden;
+}
+
+@media (prefers-color-scheme: dark) {
+    #find-ext-scrollbar-track {
+        background: #2b2b2b;
+    }
+}
+
+#find-ext-scroll-thumb {
+    position: absolute;
+    right: 0;
+    width: 100%;
+    min-height: 30px;
+    background: #aaaaaa;
+    border-radius: 3px;
+    cursor: pointer;
+    box-sizing: border-box;
+    transition: background 0.15s;
+}
+
+@media (prefers-color-scheme: dark) {
+    #find-ext-scroll-thumb {
+        background: #6b6b6b;
+    }
+}
+
+#find-ext-scroll-thumb:hover {
+    background: #888888;
+}
+
+#find-ext-scroll-marker-container {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    pointer-events: none;
+}
+
+.find-ext-scroll-marker {
+    display: block;
+    position: absolute;
+    left: 0;
+    right: 0;
+    width: 100%;
+    height: 4px;
+    min-height: 4px;
+    opacity: 0.85;
+    z-index: 2;
+    box-sizing: border-box;
+    pointer-events: none;
+    margin: 0;
+    padding: 0;
+    border: none;
+    border-radius: 1px;
+}
+
+.find-ext-scroll-marker.find-ext-marker-active {
+    z-index: 3;
+}
diff --git a/content/scrollbar.js b/content/scrollbar.js
new file mode 100644
index 0000000..b5b6374
--- /dev/null
+++ b/content/scrollbar.js
@@ -0,0 +1,309 @@
+'use strict';
+
+/**
+ * Create the ScrollbarHighlightMaker namespace. This component renders a
+ * custom "fake" scrollbar overlay on the right edge of the page, with
+ * markers indicating the position of search occurrences in the document.
+ *
+ * Native browser scrollbars cannot be styled or overlaid directly by an
+ * extension, so this component hides the native scrollbar for the duration
+ * of the search and replaces it with a fully interactive substitute
+ * (draggable thumb, click-to-jump track) plus one marker per occurrence.
+ * */
+Find.register('Content.ScrollbarHighlightMaker', function (self) {
+
+    const FALLBACK_SCROLLBAR_WIDTH = 13;
+    const MIN_THUMB_HEIGHT = 30;
+    const MARKER_HEIGHT = 4;
+    const FRAME_INTERVAL = 1000 / 60; // ~60 FPS
+
+    let options = null;
+    let globalStyle = null;
+    let overlay = null;
+    let track = null;
+    let thumb = null;
+    let markerContainer = null;
+    let currentScrollY = 0;
+    let docInvisibleHeight = 0;
+    let scrollListener = null;
+    let scrollTicking = false;
+
+    let occTopPositionMap = new Map();
+
+    /**
+     * Compute the native scrollbar width for this page. Falls back to a
+     * reasonable default when OS-level overlay scrollbars are in use, since
+     * those report a width of 0.
+     *
+     * @private
+     * @returns {number} The scrollbar width, in pixels
+     * */
+    function getScrollbarWidth() {
+        const w = window.innerWidth - document.documentElement.clientWidth;
+        return w > 0 ? w : FALLBACK_SCROLLBAR_WIDTH;
+    }
+
+    /**
+     * Build and inject the overlay DOM structure (native scrollbar
+     * suppression style, track, thumb, and marker container) into the page.
+     *
+     * The scrollbar-suppression rules are injected here as a JS-managed
+     * <style> element rather than folded into the static stylesheet
+     * (scrollbar.css), because manifest-declared content CSS applies to
+     * every page at all times, even when find is not active. Keeping these
+     * two rules JS-injected means they are only ever present while this
+     * component is mounted, and are removed in destroy().
+     *
+     * The overlay is appended directly to the light DOM (no Shadow DOM),
+     * since manifest-declared CSS cannot pierce a shadow root.
+     *
+     * @private
+     * */
+    function addComponents() {
+        globalStyle = document.head.appendChild(document.createElement('style'));
+        globalStyle.textContent =
+            '::-webkit-scrollbar { width: 0px !important; height: 0px !important; }' +
+            'html { scrollbar-width: none !important; }';
+
+        overlay = document.body.appendChild(document.createElement('div'));
+        overlay.id = 'find-ext-scrollbar-overlay';
+
+        track = overlay.appendChild(document.createElement('div'));
+        track.id = 'find-ext-scrollbar-track';
+        track.style.width = getScrollbarWidth() + 'px';
+
+        thumb = track.appendChild(document.createElement('div'));
+        thumb.id = 'find-ext-scroll-thumb';
+        
+        markerContainer = track.appendChild(document.createElement('div'));
+        markerContainer.id = 'find-ext-scroll-marker-container';
+
+    }
+
+    /**
+     * Recompute the thumb's height and vertical offset based on the current
+     * document and viewport dimensions, and the current scroll position.
+     *
+     * @private
+     * */
+    function updateThumb() {
+        const scrollElement = document.scrollingElement;
+        const docHeight = scrollElement.scrollHeight;
+        const viewHeight = window.innerHeight;
+
+        if (docHeight <= viewHeight) {
+            thumb.style.display = 'none';
+            return;
+        }
+        thumb.style.display = 'block';
+
+        const thumbHeight = Math.max(MIN_THUMB_HEIGHT, (viewHeight / docHeight) * viewHeight);
+        const maxThumbTop = viewHeight - thumbHeight;
+        currentScrollY = window.scrollY || scrollElement.scrollTop;
+        docInvisibleHeight = docHeight - viewHeight;
+        const scrollRatio = currentScrollY / docInvisibleHeight;
+        thumb.style.height = thumbHeight + 'px';
+        thumb.style.top = Math.min(maxThumbTop, scrollRatio * maxThumbTop) + 'px';
+    }
+
+    /**
+     * Bind a throttled scroll listener that keeps the thumb position in
+     * sync with the native page scroll position.
+     *
+     * Uses setTimeout at a fixed 60 FPS interval rather than
+     * requestAnimationFrame, since rAF callbacks can be deferred by the
+     * browser during scroll-linked effects (see MDN's guidance on the
+     * "scroll" event and asynchronous panning).
+     *
+     * @private
+     * */
+    function bindScroll() {
+        scrollTicking = false;
+        scrollListener = function () {
+            if (!scrollTicking) {
+                scrollTicking = true;
+                setTimeout(function () {
+                    updateThumb();
+                    scrollTicking = false;
+                }, FRAME_INTERVAL);
+            }
+        };
+        window.addEventListener('scroll', scrollListener);
+    }
+
+    /**
+     * Bind a click listener on the track that scrolls the page to the
+     * corresponding position when the user clicks outside the thumb.
+     *
+     * @private
+     * */
+    function bindTrackClick() {
+        track.addEventListener('click', function (e) {
+            if (e.target === thumb) return;
+            const ratio = (e.clientY - track.clientTop) / track.clientHeight;
+            const targetY = ratio * docInvisibleHeight;
+            window.scrollTo({ top: targetY, behavior: 'smooth' });
+        });
+    }
+
+    /**
+     * Bind mouse listeners on the thumb enabling drag-to-scroll behaviour.
+     *
+     * @private
+     * */
+    function bindThumbDrag() {
+        thumb.addEventListener('mousedown', function (e) {
+            e.preventDefault();
+            const dragStartScrollY = currentScrollY;
+            const dragStartY = e.clientY;
+
+            const onMove = function (e) {
+                const ratio = (e.clientY - dragStartY) / (track.clientHeight - thumb.clientHeight);
+                const targetY = dragStartScrollY + ratio * docInvisibleHeight;
+                window.scrollTo(0, targetY);
+            };
+            const onUp = function () {
+                document.removeEventListener('mousemove', onMove);
+                document.removeEventListener('mouseup', onUp);
+            };
+            document.addEventListener('mousemove', onMove);
+            document.addEventListener('mouseup', onUp);
+        });
+    }
+
+    /**
+     * Compute the vertical marker position (in pixels, relative to the
+     * viewport) for a given highlighted element, proportional to its
+     * position in the overall document.
+     *
+     * @private
+     * @param {HTMLElement} el - The highlighted element to compute a marker position for
+     * @returns {number} The marker's top offset, in pixels
+     * */
+    function calculateMarkerPosition(el) {
+        const clientRect = el.getBoundingClientRect();
+        const docHeight = document.scrollingElement.scrollHeight;
+        const elementAbsoluteTop = window.scrollY + clientRect.top + (0.5 * clientRect.height);
+        const proportion = elementAbsoluteTop / docHeight;
+        const markerTop = proportion * window.innerHeight;
+        return Math.max(0, Math.min(window.innerHeight - MARKER_HEIGHT, markerTop));
+    }
+
+    /**
+     * Create a single marker element for the given occurrence at the given
+     * vertical position, wrapped in a document fragment.
+     *
+     * The marker's background color is sourced from the user's highlight
+     * color options and applied inline, since a static stylesheet cannot
+     * express a value that depends on runtime user options.
+     *
+     * @private
+     * @param {number} occurrenceId - The occurrence index this marker represents
+     * @param {number} topPosition - The marker's top offset, in pixels
+     * @returns {DocumentFragment} A fragment containing the marker element
+     * */
+    function createMarker(occurrenceId, topPosition) {
+        const fragment = document.createDocumentFragment();
+        const marker = fragment.appendChild(document.createElement('div'));
+        marker.id = 'find-ext-marker-' + occurrenceId;
+        marker.className = 'find-ext-scroll-marker';
+        marker.style.top = topPosition + 'px';
+        marker.style.backgroundColor = options.all_highlight_color.hexColor;
+        return fragment;
+    }
+
+    /**
+     * Initialize the component with the given search options.
+     * Must be called before mount().
+     *
+     * @private
+     * @param {object} newOptions - The search and highlight options
+     * */
+    self.init = function (newOptions) {
+        options = newOptions;
+        occTopPositionMap = new Map();
+    };
+
+    /**
+     * Record the marker position for a given occurrence, computed once from
+     * its first highlighted element. Subsequent calls for an
+     * already-recorded occurrence are ignored.
+     *
+     * @private
+     * @param {number} occIndex - The occurrence index
+     * @param {HTMLElement} el - The first highlighted element for this occurrence
+     * */
+    self.addOccurrence = function (occIndex, el) {
+        if (!occTopPositionMap.has(occIndex)) {
+            occTopPositionMap.set(occIndex, calculateMarkerPosition(el));
+        }
+    };
+
+    /**
+     * Mount the scrollbar overlay, thumb, and marker container into the
+     * page, and bind all interaction listeners.
+     *
+     * @private
+     * */
+    self.mount = function () {
+        addComponents();
+        bindTrackClick();
+        bindThumbDrag();
+        updateThumb();
+        bindScroll();
+    };
+
+    /**
+     * Render markers for every occurrence collected so far via
+     * addOccurrence().
+     *
+     * @private
+     * */
+    self.createMarkers = function () {
+        occTopPositionMap.forEach(function (markerTop, occIndex) {
+            markerContainer.appendChild(createMarker(occIndex, markerTop));
+        });
+    };
+
+    /**
+     * Highlight the marker corresponding to the given occurrence index as
+     * the active occurrence, clearing the active state from all others.
+     *
+     * @private
+     * @param {number} occIndex - The occurrence index to mark active
+     * */
+    self.setActive = function (occIndex) {
+        if (!markerContainer) return;
+        Array.from(markerContainer.children).forEach(function (el, index) {
+            const isActive = index === occIndex;
+            el.classList.toggle('find-ext-marker-active', isActive);
+            el.style.backgroundColor = isActive
+                ? options.index_highlight_color.hexColor
+                : options.all_highlight_color.hexColor;
+        });
+    };
+
+    /**
+     * Remove the scrollbar overlay and all injected styles from the page,
+     * and unbind the scroll listener. Safe to call when nothing is mounted.
+     *
+     * @private
+     * */
+    self.destroy = function () {
+        if (scrollListener) {
+            window.removeEventListener('scroll', scrollListener);
+            scrollListener = null;
+        }
+        if (overlay && overlay.parentNode) {
+            overlay.parentNode.removeChild(overlay);
+        }
+        if (globalStyle && globalStyle.parentNode) {
+            globalStyle.parentNode.removeChild(globalStyle);
+        }
+        overlay = null;
+        track = null;
+        thumb = null;
+        markerContainer = null;
+        globalStyle = null;
+    };
+});
diff --git a/manifest.json b/manifest.json
index 5f546be..610c1ab 100644
--- a/manifest.json
+++ b/manifest.json
@@ -42,11 +42,15 @@
       ],
       "all_frames": false,
       "run_at": "document_end",
+      "css": [
+        "/content/scrollbar.css"
+      ],
       "js": [
         "app.js",
         "/lib/html-entity-handler/entityhandler.js",
         "/content/content.js",
         "/content/parser.js",
+        "/content/scrollbar.js",
         "/content/highlighter.js"
       ]
     }
diff --git a/manifest_firefox.json b/manifest_firefox.json
index 8f0d0c5..9d7bcec 100644
--- a/manifest_firefox.json
+++ b/manifest_firefox.json
@@ -34,16 +34,20 @@
     "matches": ["<all_urls>"],
     "all_frames": false,
     "run_at": "document_end",
+    "css": [
+      "/content/scrollbar.css"
+    ],
     "js": [
       "app.js",
       "/lib/html-entity-handler/entityhandler.js",
       "/content/content.js",
       "/content/parser.js",
+      "/content/scrollbar.js",
       "/content/highlighter.js"
     ]
   }],
   "omnibox": {
-    "keyword" : "findplus"
+    "keyword": "findplus"
   },
   "commands": {
     "_execute_browser_action": {
diff --git a/popup/js/options-pane.js b/popup/js/options-pane.js
index e28efa4..75b0533 100644
--- a/popup/js/options-pane.js
+++ b/popup/js/options-pane.js
@@ -21,6 +21,7 @@ Find.register('Popup.OptionsPane', function (self) {
         hide_saved_expressions_button: false,
         hide_clipboard_button: true,
         hide_find_replace_button: true,
+        scroll_markers: false,
         max_results: 0,
         index_highlight_color: Object.freeze({
             hue: 34,
@@ -95,6 +96,11 @@ Find.register('Popup.OptionsPane', function (self) {
             Find.Popup.Storage.saveOptions(options);
             Find.Popup.SearchPane.hideFindReplacePaneToggleButton(options.hide_find_replace_button);
         });
+        document.getElementById('scroll-markers-enable-toggle').addEventListener('change', (e) => {
+            options.scroll_markers = e.target.checked;
+            Find.Popup.Storage.saveOptions(options);
+            Find.Popup.BrowserAction.updateSearch();
+        });
 
         //Add max results slider event listeners
         let maxResultsSlider = document.getElementById('max-results-slider');
@@ -354,6 +360,7 @@ Find.register('Popup.OptionsPane', function (self) {
         document.getElementById('hide-saved-expressions-pane-toggle-option-toggle').checked = options.hide_saved_expressions_button;
         document.getElementById('hide-copy-to-clipboard-option-toggle').checked = options.hide_clipboard_button;
         document.getElementById('find-replace-toggle-option-toggle').checked = options.hide_find_replace_button;
+        document.getElementById('scroll-markers-enable-toggle').checked = options.scroll_markers;
 
         Find.Popup.SearchPane.hideOptionsPaneToggleButton(options.hide_options_button);
         Find.Popup.SearchPane.hideSavedExpressionsPaneToggleButton(options.hide_saved_expressions_button);
diff --git a/popup/popup.html b/popup/popup.html
index ee30fe1..afde887 100644
--- a/popup/popup.html
+++ b/popup/popup.html
@@ -238,6 +238,21 @@
                                  data-locale-title="extension_option_hide_find_replace_toggle_button_title"/>
                         </td>
                     </tr>
+
+                    <!-- Scroll Markers Option -->
+                    <tr>
+                        <td class="options-table-toggle-cell">
+                            <label class="switch">
+                                <input id="scroll-markers-enable-toggle" type="checkbox"/>
+                                <div class="toggle-slider"/>
+                            </label>
+                        </td>
+                        <td>
+                            <span class="def-font" data-locale-text="extension_option_scroll_markers_text"></span>
+                            <img class="information-hover-icon" src="img/icon/question-circle.svg"
+                                data-locale-title="extension_option_scroll_markers_title"/>
+                        </td>
+                    </tr>
                 </tbody>
             </table>