Skip to content
shellmap

Embed shellmap on your blog

Drop a placeholder <div> and one script tag into any HTML page. Renders a command card with 227 commands available across bash, zsh, fish, PowerShell, and cmd.exe — copy buttons included.

The snippet

Paste this into your HTML where you want the card to appear. Replace grep with any of the 227 supported command slugs (see the full list below).

HTML
<div data-shellmap-cmd="grep"></div>
<script src="https://shellmap.eversources.app/embed.js" async></script>

The script tag is needed once per page — the IIFE auto-discovers every data-shellmap-cmddiv on the page and mounts each one into a shadow DOM so host-page CSS can't leak in.

Live preview

Three widgets rendered live on this page — each from a different rooting (Unix utility, PowerShell-rooted reverse lookup, archive tool with Windows-side divergence). Try the tabs and copy buttons.

data-shellmap-cmd="grep"— Unix classic, equivalents in every shell
data-shellmap-cmd="get-childitem"— PowerShell-rooted, reverse lookup for Linux users
data-shellmap-cmd="tar"— archive tool, native on Windows 10 1803+ as `tar.exe`

The widget auto-themes via prefers-color-scheme— it follows the visitor's OS-level dark/light preference inside its own shadow DOM. To force a specific theme regardless of OS, add data-shellmap-theme="dark" or data-shellmap-theme="light" to the placeholder <div>.

How it works

  • Placeholder. Add a <div data-shellmap-cmd="<command>"></div> where the card should render. The data-shellmap-cmd attribute value is the command slug — e.g. grep, ls, Get-ChildItem.
  • Loader. Include <script src="https://shellmap.eversources.app/embed.js" async></script> once per page (anywhere — the script defers via DOMContentLoaded).
  • Fetches JSON from /embed/<slug> with permissive CORS (statically generated at build time, cached at the edge for 1 hour client-side, 1 day on the CDN).
  • Shadow DOM. Each card mounts into attachShadow({ mode: 'open' }) with inline styles, so the host page's CSS, Tailwind reset, Bootstrap, etc, can't bleed in and break the layout.
  • Zero dependencies. Vanilla JS, ~3KB minified. Works in every browser with shadow DOM support (Chrome 53+, Firefox 63+, Safari 10+, Edge 79+).

Supported commands (227)

Any of the 227 command slugs below works as the data-shellmap-cmd value. Click any to see its canonical page.

License & attribution

The widget is free to embed on any site, commercial or non-commercial. The card's footer links back to the full command page on shellmap — that's the only attribution we ask for, and it's baked in. No analytics, no tracking, no cookies set by the widget.