Augment the web apps you cannot change.
Drag it to your bookmarks bar. How it works
Best on desktop
An animated walkthrough: an expense report page that only takes manual entry gains an agentlet panel on top of it. The panel reads an uploaded receipt into the form, adds an Excel export the app does not have, and answers questions about the page, all without changing the host page itself. It ends with example features from the agentlet library.
- Your app as it is today. Expenses are typed in by hand, field by field.
- An agentlet was built to add features to this app. Just click the agentlet icon.
- The agentlet panel opens on top of the app and offers its services.
- Read a receipt. Upload it and the form is filled for you. You review and submit.
- Export to Excel. The app has no such feature. The agentlet adds it.
- Ask questions about the data on the page.
- The host page did not change. Everything was added on top, with agentlet.
- These are just examples. Build what your team needs, with many features ready to use in the library.
Demo sandbox a sample receipt, an expense form and a supplier form
Demo sandbox
A fictitious receipt, a small expense form and a supplier form, usable by hand, that send nothing. Open the live demo above and pick "Receipt to expense report" to watch an agentlet read the receipt and fill the form for you instead. Pick "Paste a company as a supplier" to paste a copied company into the supplier form.
New supplier
Recent expenses
| 2026-02-02 | 54.10 EUR |
| 2026-02-18 | 120.00 EUR |
| 2026-03-01 | 18.50 EUR |
The sandbox is a sample page. To see agentlet on real sites such as Wikipedia, use the known-sites bookmarklet. Its demos are read-only.
See it in action
The same business application, before and after being augmented with an agentlet.
agentlet (n.): a small, page-specific tool injected into a web app you don't control, like a bookmarklet with a side panel, forms, tables and AI.
Three ways to deploy
The same core augmentation capabilities, adapted to different technical environments and constraints.
Bookmarklet
A small JavaScript snippet stored as a browser bookmark. Clicking it injects the agentlet into the current page, with no installation required.
Injected at runtime, nothing to install
Extension
An installable extension that launches agentlets with access to browser APIs, persistent state, and automatic injection on chosen sites.
Injected on the sites you choose
Native
The same code the bookmarklet would inject at runtime is instead loaded directly by the host application, for teams who can add a script tag but not change the backend.
Shipped by the host application
What it brings to your application
An expense form filling in automatically: vendor, date, amount and cost center, then the submit button gets a highlighted outline for the user to review, not submitted automatically.
Forms
Extract form structure and fill forms programmatically, with AI-friendly data formats.
Filling triggers the same JavaScript events a real user would, so the host page reacts normally.
The user reviews and submits; agentlet never submits a form on its own.
window.agentlet.forms.fill(form, { '#email': value })A paginated invoice table exporting to Excel: rows highlight, the page counter advances through all three pages, then a file, invoices.xlsx, 42 rows, appears in the panel.
Tables to Excel
Extract table data with optional export to Excel, using SheetJS.
Pagination is supported once you give it the next-button selector, so multi-page tables export in one pass.
window.agentlet.tables.extractAndDownload(table)A bar chart being selected with a dashed rectangle, then a thumbnail of it slides into the panel and an answer types out: March is 18 percent above plan, travel drives most of the gap.
Screenshots
Capture web elements as images with HTML2Canvas, for AI-powered visual analysis.
Capture to a data URL, a blob, a direct download, or straight to the clipboard.
window.agentlet.utils.ScreenCapture.captureAsDataURL()A file, invoice.pdf, drops onto the panel. It lists the extracted vendor, date and amount, then those values flow into the expense form on the page.
AI, text, images, PDF
Direct integration with AI providers, currently OpenAI, with multimodal support for text, images, and PDFs.
PDF pages convert to images automatically before analysis.
window.agentlet.ai.sendPrompt('Summarize this page')An export dialog asking Cost center, with three options. The cursor picks Travel, the dialog closes, and a toast confirms 12 rows exported before fading.
Dialogs and notifications
A unified dialog system for info, input, wait, and progress, plus toast-style message bubbles for status updates.
Both are the building blocks agentlets use to ask the user something or confirm an action completed.
window.agentlet.utils.Dialog.info('Export complete')The panel asks to sign in, with its actions greyed out. Clicking opens a small identity provider popup, labelled id.example.com, which closes on its own, and then a Signed in pill appears as the actions turn active.
Authentication
Optional popup-based authentication for OIDC, OAuth2, SAML, and custom identity providers, with configurable token extraction.
The popup and its origin are validated before any token is accepted; the host page session is untouched.
window.agentlet.auth.startAuthentication()A host page with aggressive red, uppercase, heavy-border buttons. A pulse shows that styling reaching the dashed shadow root boundary around the panel and stopping there: the panel keeps its own clean style.
Shadow DOM isolation
The panel, dialogs, and toasts mount inside an open shadow root by default, isolating their CSS from the host page in both directions.
A host page's resets and global element styles no longer reach into the panel, and the panel's own styles never leak back out.
A code card defines mount, container, context, a real BaseModule lifecycle method. That line highlights, then the panel, empty until then, renders its brand and three actions in, one row at a time.
Mount API
mount(container, context) and unmount(container) give module authors an explicit place to attach a UI framework root, instead of only returning an HTML string.
The default implementation covers plain HTML; overriding it is only needed to host React, Vue, Lit, or a similar framework.
async mount(container, context) { /* attach a UI framework root */ }Guiding principles
- Target specific needs and pages instead of generic, global changes.
- Respect the host application's styles without polluting its CSS.
- Offer opt-in features through a side panel, not automatic changes.
- Assist but do not override: fill forms to save time, never auto-submit.
- Keep each agentlet's own code small and rely on existing backend APIs for complex logic.
Compared to robots
Agentlets can look like small, local robots, the kind used in RPA (robotic process automation). They are not true bots: they depend on the context of the user's active tab and enhance, rather than replace, the user's interaction.
Scroll for more
| Aspect | Robot | Bookmarklet | Extension | Native |
|---|---|---|---|---|
| Installation | Heavy: desktop and backend | Light: bookmarklet | Light: browser extension | Light: served by host app |
| Autonomy | Fully autonomous | Needs user action | Semi-autonomous | Semi-autonomous |
| Security, scope of action | Full access: OS, files, apps | Page privileges, browser only | Extended: extension APIs | Page privileges, inside app |
| Robustness to UI changes | Fragile | Robust with good selectors | Same as bookmarklet | Very robust: tied to app code |
| Performance | Often slow | Instant | Instant | Instant |
| Relies on user context | Yes | Yes | Yes | Yes |
| Interacts with page like a user | Yes | Yes | Yes | Yes |
| Goes beyond current page | Yes | No: single page app only | Yes: across browser tabs | No: single app context |
| Goes beyond browser | Yes: system-wide | No | No | No |
| Interacts with embedded elements | Limited: surface only | Deep: full DOM access | Deep: same, plus APIs | Deep: full access to app DOM |
Compared to userscripts and extensions
Userscripts (Tampermonkey and similar) and hand-written browser extensions also change pages you do not own, and are often the simpler choice. Pick a userscript when only you will use the script. Pick an extension when you need browser APIs, background work or a store listing. Pick agentlet when colleagues should run the tool from a bookmark without installing anything, when the host app can load it directly, or when you want one panel, set of helpers and lifecycle across all three ways of shipping it.
Scroll for more
| Aspect | Userscript | Hand-written extension | agentlet-core |
|---|---|---|---|
| Install for the user | A userscript manager, then the script | The extension | Nothing for a bookmarklet, or nothing if the app embeds it |
| Runs without a click on matching pages | Yes | Yes | Only when embedded or loaded by an extension. A bookmarklet needs a click |
| Pages with a strict Content Security Policy | Works | Works | A CDN bookmarklet is blocked |
| Panel UI, form, table, screenshot and AI helpers | Write them yourself | Write them yourself | Included |
| Module lifecycle and URL matching | Match rules in the script header | Match rules in the manifest | Included, including single page app navigation |
| Cross-origin requests and background work | GM_xmlhttpRequest and storage APIs | Full extension APIs | Same limits as the host page |
Get started
Install the package, or follow the quick start for a working bookmarklet or page in two minutes, with no clone.
npm install agentlet-core