plain/devtools home

Embed a widget

Put a working cron explainer or contrast checker in your docs or blog with one snippet. The widget runs in your visitor's browser, with no tracking script and no uploads, and carries a plain attribution link.

How it works

  • Paste the snippet into your page. It is an iframe plus one line of text with a link back.
  • The iframe loads a stripped-down page with just the tool. All work happens in the visitor's browser, and the widget page makes no network requests of its own.
  • The attribution link is a plain text link to the full tool, tagged with utm_source=embed so you can see embed traffic in your own analytics if you wish. It uses rel="nofollow noopener" so it is not treated as an endorsement link.
  • Free for any use. Keep the attribution line.

Cron explainer

Explains a five-field cron expression in plain English and lists the next five run times. Good for scheduler docs, CI guides and Kubernetes tutorials.

Color contrast checker

Converts HEX, RGB and HSL and checks WCAG contrast ratios for a text and background pair. Good for design-system docs and accessibility guides.

Frequently asked questions

Can I change the height or width?

Yes. Edit the width and height attributes. The tools adapt down to phone width.

Does the widget track my visitors?

The widget page loads no analytics or ad script, sets no cookies, and sends nothing to a server. It can only be framed by other sites because this page's headers allow it for the widget pages alone.

Do I have to keep the attribution?

Yes, please keep the line under the iframe. It is the only cost of the widget.

esc
↑↓ move↵ open? all shortcuts

Keyboard shortcuts

Cmd or Ctrl shortcuts always work.
Everywhere
Everywhere
Open the command palette
CtrlK
Open the palette (outside a text field)
/
Show these shortcuts
?
Toggle light and dark theme
t
Go home
gh
Go to all tools
gt
On a tool page
On a tool page
Run the main action
Ctrl↵
Copy the output
c
Load the next sample
s
Focus the input
i
Leave a text field
Esc
Previous or next tool
[]
In the palette
In the palette
Move the selection
↑↓
Open the selected item
↵
Close
Esc