Ever sent a link to (what is supposed to be) a specific part of a webpage only to have the recipient struggle to find the section you wanted them to see? Wouldn’t it be easier for both of you if you could make the exact text you care about be highlighted on their screen? Find out here how to create a link with highlighted text on a website and make the information you want to share nigh impossible to miss.
First, Crocodile Rock
Like any hollow body considerably filled with air, crocodiles float.
This is not always what crocodiles want. To linger at the bottom of a lake or river (waiting for prey to come by), they do not get rid of all the air, however; they displace a bit of it with something dense and heavy.
That’s why, in the condensed version, you can see crocodiles swallow rocks when they are about to go for a dive. The stones may also help break down the food, once it has arrived, in digestion.
Now, do you want to make a link that does not stay on the surface either but dives deep and takes the reader down to any part of a page? Let’s swallow some ahrefs for just the right amount of buoyancy:
How to Create and Share a Website Link with Highlighted Text
Time needed: 2 minutes
To create a link that will open a page on the web, scroll to the desired section and highlight custom text:
- Start with a link to the page as it appears in the browser address bar.
No ‘#‘: The hash sign ‘#’ (anchor link) links to a particular part on the page and, quite naturally, can only be present once in each link; do remove # from the end along with all text after it if it is present.
- Append
#:~:text=.Here’s why: We will employ the anchor link with a target not set by the page’s author but created from the text on the page with this special syntax.
- Add the the text you want to be the target and highlighted on the page.
First match: The browser will jump to the first occurrence of the text on the page.
Escapism: For any but the most simple strings, escape the text for use in web addresses (URIs); see below.
Make it easy: Use the tool below to create the link from its parts instead of concocting it laboriously by hand.
Example: https://ladedu.com/…/#:~:text=this%20very%20text will link to this very text. - Share the link you created using email, text, social media etc.
Received a link yourself? How to View a Link without Opening It
Copy a Link to Highlighted Text in Safari
To get a link with highlighted text to a page you have opened in Safari on a Mac, iPhone or iPad:
- Highlight the text you want to be highlighted when the link is followed.
- Click on the highlighted text with the right mouse button (Mac) or tap (iPhone and iPad) to reveal the context menu.
- Select Copy Link with Highlight from the menu.
On the flip side: How to Prevent Text from Turning into a Link
Link Generator for Highlighted Text on Any Page
Don’t want to build a highlighting link by hand? Use the tool below to have it constructed for you.
To create a link to any text on a website:
- Paste the page’s address as well as the text you want to highlight below.
- Copy the resulting URI from the Link: field.
How to Create and Share a Website Link with Highlighted Text: FAQ
Will this work in all browsers?
No.
Scrolling to text from the URL works in
- Chrome 81 and later as well as most Chromium browsers (including Edge)
- Safari 16.1 and later.
Notably, the links will currently not work in Firefox. Other, specifically older, browsers not on the list above will also typically not let you link to any part of a page.
Speaking of Firefox: How to Remove an Element from a Website in Firefox
Can I highlight more than one passage?
Yes.
Following the first text= section, you can append further strings to highlight with &text=.
Example: https://ladedu.com/…/#:~:text=link&text=rock will highlight the first instances of link and rock on this page.
Can I link to a passage more precisely?
Yes.
You can specify what comes before and after the highlighted passage using the prefix and suffix arguments. The prefix and the suffix will not be highlighted.
For the prefix, use text-, before the highlighted text; for the suffix, append ,-text.
Example: https://ladedu.com/…/#:~:text=a-,link,-that will highlight the first instance of link that appears between a and that (as a link that).
(Tested with Safari 17–18 and Chrome 123–138 on the desktop; first published May 2024, last updated June 2025)