Install with NPM:
npm install linkifyjs
Linkify is a JavaScript plugin. Use Linkify to find links in plain-text and convert them to HTML <a> tags. It automatically highlights URLs, #hashtags, @mentions and more.
Demo
Enter some links into the "Before" box below. The result will appear in the "After" box in real-time.
Before
After
Linkify works with all kinds of links. Here are some examples:
- URLs with protocols: https://github.com
- URLs without protocols: www.npmjs.com
- Emoji domains like 👻💥.ws
- IP Addresses such as 127.0.0.1
- Email addresses (hello@example.com)
- "At"-Mentions like @tc39 or @rust-lang
- Hashtags #PhotoOfTheDay or #スナップ
Custom link formats are also possible!
Linkify is made with ❤️ by @nfrasser
Source code
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const beforeEl = document.getElementById('linkify-demo-before') | |
| const afterEl = document.getElementById('linkify-demo-after') | |
| const options = { | |
| rel: 'nofollow noreferrer noopener', | |
| formatHref: { | |
| hashtag: (val) => `https://bsky.app/hashtag/${val.substr(1)}`, | |
| mention: (val) => `https://github.com/${val.substr(1)}` | |
| } | |
| } | |
| afterEl.innerHTML = linkifyStr(beforeEl.value, options) | |
| beforeEl.addEventListener('input', () => { | |
| afterEl.innerHTML = linkifyStr(beforeEl.value, options) | |
| }) |
Features
- Detect URLs and email addresses
- #hashtag, @mention, IP address plugins
- React and jQuery support
- Multi-language and emoji support
- Custom link plugins
- Fast, accurate and small footprint (~11kB gzipped)
- 95%+ test coverage
- Compatible with all modern browsers