One tag to rule them all

By Swapnil Nair

Tags: #tools

Ever wanted to quickly jot something down without opening Notepad, Docs, or some clunky web app?

Let me introduce you to a tiny HTML trick that turns your browser into a simple notepad:

data:text/html, <textarea style="margin:5%;font-family: Helvetica,SanFrancisco,sans-serif; font-size: 1.4em; width: 100%; height: 100%; border: none; outline: none" autofocus />

Paste that into your browser’s address bar and hit enter. Boom — you’ve got a clean, full-page text area to start writing instantly.

But there’s more…

Try this next:

data:text/html, <div contenteditable style="margin:5%; font-family: Helvetica,SanFrancisco,sans-serif; font-size: 1.4em;">Start typing here...</div>

That magic attribute — contenteditable — makes any element editable. No forms, no scripts, no fuss. Just HTML and your thoughts.


Why this is awesome:

Give it a try. Let your browser do the writing — you might not need a note-taking app after all.