Learn to use CodePen from a co-founder of CodePen

Chis Coyier, who co-founded CodePen, demonstrates how to use CodePen and shares some little-known tricks.

CodePen is a social development environment that allows you to write code in the browser, and see the results of it as you build.


Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://medium.freecodecamp.org

And subscribe for new videos on technology every day: https://youtube.com/subscription_center?add_user=freecodecamp


This Post Has 44 Comments

  1. Supreme

    Gonna have to start using this thanks for the info !

  2. LIZXP

    Just wondering how he does that 3:13 type a h2 line then whole code showing up thanks for the reply in advance

  3. John krawczyk

    Very nice but I'm not approaching it from CodeCamp. I'd like to see more on the functionality of CodePen rather than a "Try to get a JavaScript fcn working" tutorial. The reason I got a Pro CodePen account is actually to post help requests on StackOverflow. This way I can just say "Help, X isn't working: here's my Code" and people could just fork suggestions to it.

  4. Allen Amusin

    how did you make the and symbol in the css at time 14:59? When I do shift 7 I get & but the one in the video looks different. My code still works.

  5. NatKing1u1z

    I keep getting a 404 error when creating a new file and I'm not able to save and run

  6. Muhammad Rafay

    Can i write code from C or Python or any other languages except HTML, CSS or JS?? Or is it limited to that

  7. Jawwad Rehan

    It is a very informative video and CodePen is really cool thing.

  8. Deacon Blues

    Don't understand why you would make privacy a paid feature? Privacy on the internet is crucial in these times!

  9. Sergio Arroyo

    nice one . Thank you so much for creating this! I heart unlimited 🙂

  10. こま

    元気いっぱいで最高です!Thank you!

  11. Honestly Marie

    This tutorial was very informative and hilarious. Thanks a bunch!


    Why aren't you showing us how to create the pop up sales notification?…..I NEED HELP!!!

  13. skeeterburke

    for a moment there i thought you were gonna call us all freaks! oh, "free code camp people" …… i'd be fine with freak anyway, cuz you can't hide from the truth

  14. Sheila R.

    Hi, how can I make an animation using codepen? animation: hand 5s infinite; won’t work. Thank you! Btw I am trying to move the hand of my robot

  15. Ian Williams

    Thanks for this.
    I have been working through freecodecamp all good and then they suggest using codepen and its extremely daunting, as it is when you are to complete your first assignment ! You get to your first assignment and then you get a new application as well! Us noobs may panic.

    Your enthusiastic and interesting presentation has taken away some of the fear, off to have a play now, thanks again.

  16. VRuno

    Why when I use to try the "autofill" option with the <tab> key, doesn't work? 🧐
    – or is this option only for a premium account?

  17. fly by

    Found this before some weeks. I'm relativily new to JS, CSS, HTML development. Was more into Win32 (Borland Delphi VCL), Winforms and WPF UI design before. Codepen ist really cool stuff!

  18. Mujtaba Hassan

    M not using any editor everything m doing on code pen it is just extra amazing , huge thanks to the founder of the code pen

  19. I love the video the way you can of explain everything was amazing and it would be really nice if you can make another video how to used it but this time more JS and other programs …BTW I Love your channel…You are awesome.

  20. chococandy

    Interesting! My friend is currently using it and it sounds interesting, so why not give it a try:) Thank you sir for this informative video.

  21. silenthunder

    I'm currently in coding class and I didn't even want it…

  22. Genesis Cardozo

    I think I just fell in love with codepen.

    thank you for this video.

  23. Sourav Ganguly

    I can't find the dropdown option in codepen although it is showing "not right file name". Please help

  24. Driss MAREOUDI

    Thank you for the nice video. I’m supposed to build the attribute page project with pencode, but I am not able to use it with my screen reader. By the way, I am blind. Thanks

  25. stardust

    can i copy the works from the codepens and use them????

  26. Thriveark

    Great introduction Chis, amazing, very useful application.

  27. FEAR GOD.Repent of your Sin and have faith in our Lord and Saviour Jesus Christ forever; for the forgiveness of your sin and for the salvation of your soul.

    The Lord Jesus Christ can grant us everlasting life; afterlife here on earth without pain, suffering and death. (Revelation 21:4) when we Believe, have faith and love Him with all our heart, soul, mind and all our strength (Mark 12:30-31) to the glory of God the father (Philippians 2:10-11)

    Mark 16:15-16
    New King James Version
    15 (A)And He said to them, “Go into all the world (B)and preach the gospel to every creature. 16 (C)He who believes and is baptized will be saved; (D)but he who does not believe will be condemned.

    I love you as a brother/Sister in Christ enough to tell you the truth, I don’t want you to end up in Hell because of your sins; it takes my breath away. Bro/Sis for your own sake; Humble yourself before the almighty God and His son our Lord and saviour Jesus Christ for the forgiveness of all your sins . Before it’s too late. Repent; confess and forsake your sins and trust in Lord Jesus Christ for the forgiveness of your sins and for your eternal salvation. The choice is yours .

    We are all sinners and desperately need God’s mercy. (Romans 3:23)

    We have violated His moral law the Ten Commandments. You shall not lie , you shall not steal , you shall not covet , you shall not used God’s name in vain such as telling OMG TO express disgust , you shall not commit adultery, you shall have no other God’s before Him. Remember and Keep the sabbath holy, honour your mother and your father, you shall not worship graven images or statue.
    (Exodus 20:1-17)

    You shall not look with Lust it is adultery in the heart
    (Matthew 5:27-30)

    These moral law proves that we have violated God’s moral law.

    You and I broke God’s moral law and the Lord Jesus Christ paid our punishments in full by His most precious blood.

    He redeem, sanctify, and washed us by His most precious blood.

    Our Lord and saviour Jesus Christ died for your Sin for your salvation and He rose from the grave .

    The question is would you receive His salvation for you
    Today ?

    Accept and receive Jesus Christ as your personal Lord and saviour from Sin and Hell.

    The choice is yours.

    Acts 20:21
    King James Version
    21 Testifying both to the Jews, and also to the Greeks, repentance toward God, and faith toward our Lord Jesus Christ.

  28. Bryan Larrauri

    Hi, am I the only one who's not able to see the Dashboard option? Thank

  29. david abba

    PREACH!!!!!!!!!!!The GoSpel Of TruTh
    thanks alot
    luv at first site

Leave a Reply