My Codepen Cheatsheet

I’m finding Codepen to be more and more valuable not only for testing out new code and ideas, but also – when working on large applications – as a time-saving rapid prototyping environment which sidesteps the overhead of back-end set-up. Here are some tips which I’ve found useful, for future reference.

Control the Editor View layout #

Add ?editors=1111 (change numbers as appropriate) to the URL to set which panels are maximised (in order of HTML, CSS, JavaScript, and console).

Add left, right, or top to the URL to set the editor layout.

For example:


References #

External Link Bookmark Note Entry Search