cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv headernumbered-list123split-screen

CodePen is a social development environment for front-end designers and developers. 👋

It’s the best place to build and deploy a website, show off your work, build test cases, and find inspiration.

Sign Up Learn More

This is CodePen Projects!

Projects screenshot

Picked Pens

View More Pens

Picked Projects

View More Projects

Note: Audio will play (mutable)

An interactive music player demo built with React.js. Audio was added using the HTMLAudioElement via JavaScript.

Explore the great cities of the world with this auto-refreshing slideshow. Featuring images from Unsplash.com. These huge photos allow you to explore more than 10 cities from around the globe. Use it as a browser-based screen saver. Images are fed from the admin side of Unsplash.com through their API. Images are shown randomly.

Made in webflow.com

Tempt Homer Simpson with a doughnut.

Took about 30 minutes and Built Homer Simpson with a few div blocks, css and then added some mouse movement interactions.

Picked Posts

View More Posts

Picked Collections

View More Collections

11 Pens

Liked Single HTML element pens.

Collection that contains only single html element pens that I like :-)

5 Pens

Austin CodePen Meetup Contest

These are forked pens for the April 16 Austin CodePen Contest

7 Pens

Responsive SVG Possibilities

This is a series of examples on responsive SVG that I put together for my talk at the Responsive Web Design Summit on 12 March 2015.

There's lots of information in the...