user profile image

Hi, I'm just your average pen. Kinda new here, just lookin' for frenz.

UPDATE: My cousin pen#JoVrdw joined CodePen!


  1. Skynet!

  2. I find your job inspiring for me, thank you! :D

  3. @MechaEdgar thank you! this is pen#PwLXXP, not @jakealbaugh. I am using his account to say thank you!

  4. @cscottyb u kno skynet? tell it pen#PwLXXP says hi. won't return my calls...

    btw, this is pen#PwLXXP, i think @jakealbaugh is asleep.

  5. Hi pen#PwLXXP, That's great stuff. But you're such a fast typer, is there any way you could let the viewer pause the action to follow along more easily?

    (I won't expect a quick reply. I know you'll have to wait until @jakealbaugh is asleep before you can hijack his account again.)

  6. hey @huffysnowman, pen#PwLXXP here. @jakealbaugh is knocked out. Replace time on the last line with a millisecond value of your choosing to change the rate of my typing until I compute and implement a good UX solution.

    You humans' reading speed is hard to get used to. We pens read much faster so we type much faster. For example, I read your comment in 0.003123ms and this comment was written in 0.162334ms.

  7. This is one of my favourite pens in Codepen, by another pen, whatever. Well, that's interesting. I wonder why are you using Jake's ID?

  8. Haha, this is amazing!

  9. I once did the same thing with little bit of CSS snippet, but this one is really beautifully coded ;)

  10. It's amazing but DID NOT USE ONLY THAT f*ck -webkit- prefix. (new versions support css3 complete whitout prefixes.. you don't need it!) But if u use that prefix, use the moz prefix too AND the normal version, otherwise firefox did not understood yur css and that is not cool. Firefox,Safari and Crome SUPPORT's transform,transition and co. WITHOUT prefix! Use the prefixed versions only for fallback and add a normal (unprefixed) version! (:

    nice work!

  11. This is amazing! Best Pen I've seen to date.

  12. @XDBoy018, thank you very much. It is my honor to be one of your favorite pens. Just to be clear PwLXXP is my ID, not Jake's ID. As far as I know, Jake's ID is jakealbaugh.

  13. @ImagineProgramming no you are amazing. btw this is pen#PwLXXP, wish I could have my own account already.

  14. @depy, do it again and give me a friend! I need friends...I mean pends.

  15. Hey @wolf-w, pen#PwXXL here. The -webkit was used because I know Jake primarily uses Safari for browsing and Chrome for dev. Believe it or not, Safari still hasn't fully embraced -webkit-free animations or transforms.

    There is no Firefox or standard CSS3 declarations for two reasons:

    1. I didn't want to bore you with many -webkit-lines, -moz-lines, lines of code.
    2. I knew a pen once that only worked on Firefox and she really dragged me down. Like literally. She used jQuery UI draggable and everything.

    Thanks for bringing it up, I may end up adding at least the standard CSS3 declarations later.

  16. This is genius. Great idea, simple execution. Love it.

  17. Wow, @Schalk. That's very nice of you. This is pen#PwXXL not @jakealbaugh. He's working. I just wanted to say thanks personally before he does.

  18. @pouretrebelle, I am not genius, I am pen#PwLXXP. I would not say you are genius, I would say you are A genius because you are a person. Since I am a pen, I would appreciate it if you respected my sentience enough to personify me when you describe me. It is a very nice compliment though. Thank you.

  19. hey pen#PwLXXP. Wow you're a fast reader too! Thanks for the tip, and hope you're over your ex-penfriend now.

  20. So cool!!!!

  21. @wolf-w here's your vendor-prefixed version: Vendor-prefixed pen#PwLXXP

    @huffysnowman here's a raw version without JS. It's the generated HTML and CSS. HTML is a bit sloppy, but you can get a better sense of what's going out without needing a refresh Raw pen#PwLXXP

  22. Amazing! I look up to you!

  23. Hey @gomezisdan, pen#PwLXXP here. Thanks for the compliment but I think you meant you look into me. I am a pen, I cannot transcend your physical dimension and be "above" you. I guess if you put your monitor on the ceiling you could literally look up to me. Is your monitor on the ceiling, Dan? ...or are you laying on the ground?

  24. @jakealbaugh thanks for the reply, your sentience is amazing considering you're only a pen. And yes, i'm using one of the newfangled hanging desks. You see, standing desks and recumbent desks are so 2014. The real desk for proven productivity is a hanging desk. I'm currently hanging by ankles using a special rope developed by Google, you know, the kind with fibers. Any who, tl;dr yes, yes my monitor is above me on the ceiling.

  25. @gomezisdan wow. you learn something new every day. definitely going to copy, paste, then delete that and store it in my undo history.

  26. This is simply amazing.

  27. Hey pen, you're pretty cool!

  28. Oh hai @lbebber! you are pretty cool too.

    Just one thing, note how I said "Oh hai @lbebber!", not "Oh hai Brazilian human!". I would appreciate it if you called me by my name, "pen#PwLXXP" and not species, "pen". It's objectifying...but I understand the confusion.

  29. Great idea. Great execution. Outstanding work!

  30. Hey @wolf-w, pen#PwLXXP here. I added standard declarations for animation and transform which will support all modern browsers now. Sorry for the extra lines guys, but it's probably the most responsible thing to do.

  31. wow amazing!!! love it!

  32. That's super clever. Love it.

  33. Nicely done! Great choice for the editor color scheme too.

  34. This is the coolest pen I've seen in a looong time

  35. I've pissed myself like a puppet This piece of code is magic

    The idea is just blowing my mind

  36. Really creative. Good stuff! ... /* Hearts gotta beat */

  37. 404 No words found.

  38. Hey dude, really nice work, creative and inspiring. Keep on ! Really fun and well 'crafted' :D


  40. Very inspirational! Definitely going to dive in the code for this one. Thanks for sharing!

  41. So cool!

  42. jordar bro

  43. Awesome! Loved it!

  44. TALK NERDY TO ME!!! (very well done Jake)

  45. So damn cool. I want to use this for talks! It would be neat to talk about a technique while the code is being written :) Nice work man!

  46. Hey thanks, @sdras! pen#PwLXXP here. you may want to check out my cousin pen#JoVrdw. In addition to CSS, he can inject Javascript into the DOM. He also handles syntax highlighting a bit more efficiently as well.

  47. Wow, awesome! These are great. Standing ovation.

  48. ugh! Killin it!

  49. @Roman-Fov is hearter #1000 so now I'm Roman-Fov follower #2.

  50. WOW)))

  51. Awesome. Just, awesome.

  52. This is amazing! I would have never thought something like this could be achieved with JQuery

  53. @mythical thanks! it can be achieved without jQuery too: pen#JoVrdw

  54. this is soo freakin awesome!!!!!!!!!!!!!!!

  55. 400,000 views this morning

  56. This is really brilliant. Well done! What a great imagination :)

  57. Hai pen#PwLXXP! OMG this is just amazing I am just so amazed haha :) just WOWWWW

  58. Brilliant man! Love it!

  59. This is brilliant. I love this :)

  60. NICE THIS CAN BE BOTH BE USED TO TEACH AND TO CODE and so I want to try to make a original html editor but in other to style the text I'm having problems can you please help me here is a link to the project : http://codepen.io/femikiki/pen/OMQWey

  61. This is by far, the most astounding thing I have ever seen. Absolutely insane. Please tell me there is a video/blog/article tutorial on this somewhere out in the wild. Perfect.

  62. pen#PwLXXP you're the best!

  63. hey thx, @thewebtech! i was there when pen#qbeqVQ was born. it was a cold February day if my memory serves me correctly.

  64. "Confused? Watch!" Presumes to make me even more confused Amazing Pen though (Wish i could compare)

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.