{ "version": "https://jsonfeed.org/version/1.1", "title": "Bookmarklets", "language": "", "home_page_url": "https://bookmarklet.one/", "feed_url": "https://bookmarklet.one/feed/feed.json", "description": "Discover a curated directory of 50+ lightweight, zero-install browser bookmarklets for SEO, web development, productivity, and design. Drag, drop, and automate in one click.", "author": { "name": "Amit Yadav", "url": "author/url" }, "items": [{ "id": "https://bookmarklet.one/best-bookmarklets-for-developers/", "url": "https://bookmarklet.one/best-bookmarklets-for-developers/", "title": "Best Bookmarklets for Developers", "content_html": "

Bookmarklets are tiny JavaScript snippets saved as browser bookmarks. No extensions, no installs, one click to run. Here are 63 of the best for developers, organized by category.

\n

SEO Bookmarklets #

\n

These tools help you audit and optimize pages for search engines.

\n\n

Web Development Bookmarklets #

\n

Tools for debugging, inspecting, and testing web pages.

\n\n

Design Bookmarklets #

\n

Quick design inspection and color tools.

\n\n

Productivity Bookmarklets #

\n

Speed up your daily workflow.

\n\n

Privacy Bookmarklets #

\n

Control your data and cookies.

\n\n

Fun Bookmarklets #

\n\n

How to Use Bookmarklets #

\n

Drag any button to your bookmarks bar. Click it on any webpage to run. That's it.

\n

Bookmarklets work in all modern browsers: Chrome, Firefox, Safari, and Edge. No installation required, no permissions needed, no data collected.

\n

Looking to build your own? Check our Bookmarklet Maker to create custom bookmarklets from JavaScript code.

\n", "date_published": "2024-03-25T00:00:00Z" },{ "id": "https://bookmarklet.one/heading-hierarchy-map-bookmarklet/", "url": "https://bookmarklet.one/heading-hierarchy-map-bookmarklet/", "title": "Heading Hierarchy Map Bookmarklet", "content_html": "

Heading structure matters for SEO and accessibility, but it's hard to see in the browser. The Heading Hierarchy Map bookmarklet shows it as a visual tree.

\n

One click generates a diagram of every heading on the page, color-coded by level from H1 (red) to H6 (purple). Click any heading in the tree to jump to it on the page.

\n

What It Shows #

\n\n

Why It Matters #

\n

SEO: Search engines use headings to understand content hierarchy. One H1 per page, proper nesting, no skipped levels.

\n

Accessibility: Screen readers use headings for navigation. Broken structure breaks the experience.

\n

Content quality: Good headings reflect organized thinking. They make content scannable.

\n

When to Use It #

\n\n
Drag me to bookmark bar: 👉🏻 Heading Map
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-20T00:00:00Z" },{ "id": "https://bookmarklet.one/ai-summarizer-bookmarklet/", "url": "https://bookmarklet.one/ai-summarizer-bookmarklet/", "title": "AI Summarizer Bookmarklet", "content_html": "

Too much content, too little time. The AI Summarizer bookmarklet extracts the most important sentences from any webpage in seconds.

\n

It uses extractive summarization, meaning it only selects sentences already in the article. No hallucinated text, no external servers, no API keys.

\n

How It Works #

\n
    \n
  1. Sentence extraction breaks text into individual units
    2. \n
  2. Word frequency analysis ranks sentences by importance
    3. \n
  3. Position scoring boosts earlier sentences slightly
    4. \n
  4. Top results become your summary
    5. \n
\n

What the Panel Shows #

\n\n

Best Results #

\n

Works best on articles with 500+ words and clear paragraph structure. Shorter content may return most of the original text.

\n

Everything runs locally in your browser. Nothing leaves your machine.

\n
Drag me to bookmark bar: 👉🏻 Summarize
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-19T00:00:00Z" },{ "id": "https://bookmarklet.one/read-aloud-tts-bookmarklet/", "url": "https://bookmarklet.one/read-aloud-tts-bookmarklet/", "title": "Read Aloud TTS Bookmarklet", "content_html": "

Some people absorb information better by listening. The Read Aloud TTS bookmarklet turns any webpage into audio using your browser's built-in speech synthesis.

\n

No extensions, no API keys, no data sent anywhere. Just click and listen.

\n

What You Get #

\n\n

Smart Content Detection #

\n

The bookmarklet doesn't read everything on the page. It finds <article>, <main>, or content containers and focuses on the actual text. Navigation, ads, and sidebars get skipped.

\n

Selective Reading #

\n

Highlight any text before clicking Play, and it reads only your selection. Useful for proofreading, testing how a passage sounds, or learning pronunciation.

\n

Browser Support #

\n

Works in Chrome, Edge, Safari, and Firefox. Chrome on desktop offers the most voices.

\n
Drag me to bookmark bar: 👉🏻 Read Aloud
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-18T00:00:00Z" },{ "id": "https://bookmarklet.one/markdown-link-copier-bookmarklet/", "url": "https://bookmarklet.one/markdown-link-copier-bookmarklet/", "title": "Markdown Link Copier Bookmarklet", "content_html": "

Writing Markdown links by hand is tedious. The Markdown Link Copier bookmarklet does it in one click.

\n

It reads the page title and URL, formats them as [title](url), and copies the result to your clipboard. Ready to paste into GitHub, Obsidian, docs, or anywhere.

\n

Where It Helps #

\n\n

How It Works #

\n
    \n
  1. Click the bookmarklet
    2. \n
  2. It reads <title> and the current URL
    3. \n
  3. Formats as [title](url)
    4. \n
  4. Copies to clipboard
    5. \n
\n

One click, no configuration.

\n
Drag me to bookmark bar: 👉🏻 Copy Link
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-17T00:00:00Z" },{ "id": "https://bookmarklet.one/sticky-header-killer-bookmarklet/", "url": "https://bookmarklet.one/sticky-header-killer-bookmarklet/", "title": "Sticky Header Killer Bookmarklet", "content_html": "

Sticky headers eat up screen space. The Sticky Header Killer bookmarklet removes them all with one click.

\n

It finds every element using position: fixed or position: sticky and resets them. Navigation bars, cookie banners, chat widgets, promotional bars, all gone. Refresh to restore.

\n

The Problem #

\n

Fixed headers take 60-120px of vertical space on every screen. On mobile, that's painful. They cause layout shifts, block content, and pull attention away from what you're reading.

\n

What It Targets #

\n\n
Drag me to bookmark bar: 👉🏻 Kill Sticky
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-16T00:00:00Z" },{ "id": "https://bookmarklet.one/dark-mode-toggle-bookmarklet/", "url": "https://bookmarklet.one/dark-mode-toggle-bookmarklet/", "title": "Dark Mode Toggle Bookmarklet", "content_html": "

Not every website offers dark mode. The Dark Mode Toggle bookmarklet fixes that with a single click.

\n

It injects a CSS overlay that inverts backgrounds to dark tones and text to light. Click once to activate, click again to turn off. No settings, no accounts.

\n

Why Dark Mode Matters #

\n

Dark mode reduces eye strain in low-light environments and saves battery on OLED screens. But many sites still don't offer it natively. This bookmarklet fills that gap universally.

\n

How It Works #

\n

The bookmarklet scans the page and injects a dark color scheme. It preserves readability while cutting glare. Works on any webpage regardless of the site's own theme support.

\n

When to Use It #

\n\n
Drag me to bookmark bar: 👉🏻 Dark Mode
\n
\n

📖 Full documentation

\n
\n", "date_published": "2024-03-15T00:00:00Z" },{ "id": "https://bookmarklet.one/bookmarklet-maker/", "url": "https://bookmarklet.one/bookmarklet-maker/", "title": "Bookmarklet Maker", "content_html": "

Bookmarklet Maker is a powerful tool that enables you to create your own custom bookmarklets, allowing you to enhance your productivity and streamline your workflow.

\n\n\n\n
\n
\n\n\n
\n
\n\n
\n
\n\n\n
\n
\n
\n

\nDrag me to bookmark bar: 👉🏻\n\n

\n
\n
\n
\n

By leveraging the power of basic JavaScript, you can transform your bookmarks from simple shortcuts to powerful and versatile tools that can help you accomplish a wide variety of tasks with ease.

\n

With Bookmarklet Maker, you can avoid cluttering your browser with unnecessary extensions, and instead create lightweight and effective solutions that work seamlessly with your existing workflow.

\n

Whether you're looking to automate repetitive tasks, simplify your browsing experience, or just boost your productivity, Bookmarklet Maker is a must-have tool for anyone looking to get the most out of their browser.

\n

Benefits of Bookmarklets #

\n\n

Bookmarklet Examples #

\n

Some examples of bookmarklets that you can create with Bookmarklet Maker:

\n

QR Code Generator #

\n
javascript:!function(){var e=\"https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=\"+encodeURIComponent(window.location.href);open(e,\"w\",\"location=no,status=yes,menubar=no,scrollbars=no,resizable=yes,width=500,height=500,modal=yes,dependent=yes\")}();
\n

Search in Google Site:All #

\n
javascript:location=\"http://www.google.com/search?num=100&q=site:\"+escape(location.hostname);
\n

Enable Right Click #

\n
javascript:document.oncontextmenu=null;
\n

Quick Note #

\n
javascript:!function(){let e=window.open(\"about:blank\",\"_blank\");e?(e.document.write(\"Enter your note here.\"),e.document.title=\"Quick Note\",e.document.documentElement.setAttribute(\"contenteditable\",\"\"),e.document.close()):alert(\"Please allow popups for this site to use the Quick Note feature\")}();
\n", "date_published": "2023-03-31T00:00:00Z" },{ "id": "https://bookmarklet.one/create-bookmarklet/", "url": "https://bookmarklet.one/create-bookmarklet/", "title": "How to Create Bookmarklets", "content_html": "

Bookmarklets are very usefull and timesaving piece of javascript code and that you can use.

\n

first let's see how a bookmarklets look like.

\n

Create Bookmarklet #

\n

Before starting to create bookmarklets few things you should keep mind,

\n\n

One Liner Bookmarklets

\n

if JavaScript code is simple then you can write that in one line and your custom bookmarklet is ready.

\n
javascript:alert(location.href)
\n

This type of bookmarklet is good if you want to extract some basic information from page where you don't need to keep track of any value.

\n

Example:

\n\n

Bookmarklets that require more than one line

\n

If your code is a bit complex and needs more space then use the wrap your function like following IIF IEF JavaScript immediately invoked function [ref]

\n
\n
/* variation 1 */
(function(){
 /* function logic here */
})();
\n
/* variation 2 */
(()=>{
 /* function logic here */
})();
\n
/* variation 3 */
(async ()=>{
 /* function logic here */
})();
\n
\n
javascript:(()=>{
  alert(location.href)
})();
\n

Example:

\n\n
\n

Now you can easily convert JavaScript code to Bookmarklets,

\n

If you find it little bit difficult to make bookmarklet then you can take help of bookmarklet maker tools.

\n

By doing so not extra script always loads on everypage, script will run only when you run it.

\n", "date_published": "2023-01-25T00:00:00Z" },{ "id": "https://bookmarklet.one/what-are-bookmarklets/", "url": "https://bookmarklet.one/what-are-bookmarklets/", "title": "What are Bookmarklets", "content_html": "
\n

Bookmarklets are small peice of JavaScript code that is stored as bookmarks in browser. Bookmarklets help in automating repetitive task, access hidden information from page.

\n
\n

Simple bookmarklets look like this

\n
javascript:alert(location.href)
\n

Just copy the above code and save it as bookmark,

\n

Once bookmark is saved you can click on it run on any webpage.

\n
\n
\n \"info\n

Bookmarklets have javascript: prefix,

\n

Wihtout javascript: prefix any JavaScript code saved as bookmark will not run in browser.

\n

Pros of using Bookmarklets #

\n\n

Cons of using Bookmarklets #

\n\n

If you want to create your bookmarklet then here is full post about How to create your own Bookmarklet

\n", "date_published": "2023-01-24T00:00:00Z" } ] }