Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.

CodePen is great for testing out front end stuff. You write HTML, CSS and JavaScript and you can see the results right below as you type. But how does it look on that fancy new phone you got this holiday? Or your old you’re about to put on eBay? Or that nasty old thing your Mom still uses?

CodePen offers all our users “Full Page” views of the Pens you build, so you can see how the things you build look without all the CodePen stuff around it.

For instance if you build a pen like:


The “Full Page” view is:


You can find that under the Share menu when in the editor. To test this Pen on your phone, you’d go to the browser on that phone and type in that URL. But wow, that’s 36 characters (depending on your user name length) to type on a tiny screen. Not to mention there are a bunch of weird characters at the end that can be obnoxious to type.

Now you don’t have to!

Just open the same Share dropdown menu in the editor and you’ll now see a place to type in your phone number. Enter it there and click the send button.


You’ll get a text message (SMS) on your phone with a URL in it you can click to go straight to the “Full View” for that pen. Much easier.

Anonymous users cannot use this feature, you’ll need to have an account. Free account holders get 10 messages a month (reset clock starts ticking when you send the first one). Basic PRO users get 50 per month and Super PRO users get 100 per month.

It’s even better for PRO users!

The “Full View” is great an all, but our “Live View” is even more awesome. Live View automatically updates itself as you type in the editor. Live View is a feature we offer all our PRO members. Lean more about it.

If you are a PRO member, you’ll automatically have the Live View URL send to your phone rather than the Full Page view, as it is nearly always more useful.

Oh yeah, and the beginning of Short URLs!

You might notice the URL’s that get sent to your phone are short URL’s that get redirected to the proper place. They all have a common format.

In our example of


The short URL would be:


To get to the Live View, there is a /v/ in there. It would be:


This is particularly useful for other devices in which you can’t send an SMS message to, like perhaps your tablet device or another computer.

We’re just getting started integrating these short URL’s into the site, so let us know if you have ideas on how to use them.

On Phone Number Formats

When entering your phone number, the format is fairly forgiving and in international format. Just type it in however you are most comfortable. If you enter 10 digits, we’ll assume it’s a U.S. or Canada phone number and automatically apply the correct country code (1). If you are outside the U.S. or Canada, add the country code first.

For instance (source):

Country Country Code Local Phone Number International Phone Number
China 86 (10) 69445464 861069445464
France 33 06 87 71 23 45 33687712345
Nigeria 234 080312345 23480312345
United Kingdom 44 07700 954 321 447700954321
United States 1 (954) 555-1234 19545551234
Venezuela 58 (0295) 416,72,16 582954167216