Create an Instant Notepad in Any Web Browser Window

Mar 27, 2013 - 15 Comments

Instant Notepad from any web browser

Ever needed a quick place to paste some text or make a quick note while you’re doing web work? Using a neat trick, you can turn any web browser window or tab into an instant notepad that you can write in, copy and paste out of, and even adjust the font sizes within. There really isn’t much to this trick, and it works in just about web browser on just about every platform, whether you’re currently in OS X, Windows, Linux, or whatever else.

All you need to do is copy and paste this into the URL bar, the hit Return:

data:text/html, <html contenteditable>

After you hit return the page will clear and you’ll be able to start typing away. Paste in to your hearts delight, anything that is text based will go in, but images won’t. The little scratch pad is completely ephemeral however, so don’t expect to save anything from it directly and if you quit and relaunch the browser, your text will no longer be there (though the editable notepad will remain, just blank).

That little snippet can be bookmarked or saved as HTML, making it instantly accessible, and if you use Safari’s Reading List you can make it sync over to another Mac, iPad, or iPhone if you want to use this on the go. That means the little instant browser notepad also works in iOS in both Safari and Chrome, though admittedly it may be less useful on the mobile side of things, and because it won’t save data, don’t expect it to replace the actual Notes app in iOS and OS X as a super syncing clipboard anytime soon.

This handy trick was found by Macgasm, and they offer a nice little tip idea if you plan on using it often: text substitution. That allows you to type something like ‘mknotepad’ to expand out the entire code snippet, which is obviously much easier to remember, here’s how to quickly set that up:

  • Open System Preferences from the  Apple menu and go to “Languages & Text”
  • Under the “Text” tab, click the + icon to add a new text substitute
  • In the left “Replace” column, add your shortcut (like “mknotepad”) and under the “With” column, paste in the code snippet: data:text/html, <html contenteditable>

This should look something like this:

Quick notepad made easy with text replacement

Close out of System Preferences and type “mknotepad” anywhere for it to expand automatically into the snippet, it works in URL bars but if you plan on using it often in a browser it’s probably best to just create a bookmark. Some third party apps will need to be relaunched for text substitution to work properly, so keep that in mind if the replacement isn’t functioning as you’d expect.


Related articles:

Posted by: Paul Horowitz in Tips & Tricks


» Comments RSS Feed

  1. Ty says:

    Wow, now this is something I can use everyday! One of the best tips yet. Thanks!

  2. Luca says:

    Thanks, very useful tips.

  3. auntchilada says:

    you can also save the window as a .webarchive file and its contents will remain persistent; shift-command-S

  4. Macfan says:

    Why? Just use Evernote

  5. david says:

    you can also bold and italicize text. and while i wasn’t able to drag and drop any pictures, it did pick up the path TO that image.

    i’m on a macbook pro running 10.8.2/safari.

  6. John says:

    Very cool. I had to bookmark it because Safari wouldn’t let me add it to my reading list. I sync my bookmarks through iCloud though so it’s the same diff.

    • Pat says:

      I did this too but it took me a while to figure out why bookmark syncing wasn’t working: the “Safari” option in iCloud was turned off! Oops. If you run into that problem, check iCloud settings and your bookmarks will then sync. Done deal, great tip!

  7. RVLI says:

    Won’t work in IE10…buuu!

  8. Sue Dunham says:

    You can also highlight and drag text to your desktop. It becomes a more permanent clipboard.

  9. Walt says:

    I made this into a bookmark and it is the first one in my Bookmarks Bar at work and at home.

  10. booree says:

    Thanks for that tip, very useful.
    I’ve created bookmark without title including this short code instead of a web link. The web bookmark default icon in chrome looks exactly like a white paper note. :)

  11. Theo Vosse says:

    Love it!

  12. Jan says:

    Very useful to me. The best tip I came across for a long time. Have your dictionary extensions installed for perfecting your writing.

  13. San says:

    This is cool! Can copy and paste any image or drag and drop images from other web pages too. I used it to quickly create an html document that can be emailed as a web page or as a pdf document.

  14. allen says:

    my safari show:data:text/html,%20%3Chtml%20contenteditable%3E

Leave a Reply


Shop on and help support OSXDaily!

Subscribe to OSXDaily

Subscribe to RSS Subscribe to Twitter Feed Follow on Facebook Subscribe to eMail Updates

Tips & Tricks


iPhone / iPad



Shop on Amazon to help support this site