Scroll to text fragmentBaseline · Newly available
Text fragments are URL fragments on the form #:~:text=snippet and link to a snippet of text within a page. The browser may scroll, highlight, or otherwise bring that text to the reader's attention.
Works in the latest version of every major browser, but older devices may not support it yet. Baseline since Oct 1, 2024.
Browser support
DesktopChrome
1–79Not supported
80+Supportedsince Feb 4, 2020
Current: 155Edge
12–79Not supported
80+Supportedsince Feb 7, 2020
Current: 154Firefox
1–130Not supported
131+Supportedsince Oct 1, 2024
Current: 157Safari
1–16Not supported
16.1+Supportedsince Oct 24, 2022
Current: 27MobileChrome Android
18–79Not supported
80+Supportedsince Feb 4, 2020
Current: 155Firefox Android
4–130Not supported
131+Supportedsince Oct 1, 2024
Current: 157Safari iOS
1–16Not supported
16.1+Supportedsince Oct 24, 2022
Current: 27How to use
Every current browser supports this, but it only became Baseline on Oct 1, 2024. Use it as a progressive enhancement, or keep a fallback if you support older devices.
Example
Full syntax and examples are on MDN: fragmentDirective.
Feature detection
JS · check before using
if ("text_fragments" in document.createElement("a")) {
// the text_fragments attribute/property of <a> is supported
}Documentation (MDN)
Specification
Usage share
Sub-features
Support for each part of the feature (3). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| Document.fragmentDirective | 86 | 86 | 131 | 18.4 | 86 | 131 | 18.4 |
| FragmentDirective | 81 | 83 | 131 | 18.4 | 81 | 131 | 18.4 |
| a.text_fragments | 80 | 80 | 131 | 16.1 | 80 | 131 | 16.1 |