It does limit the upload of some file types (for example, back-end languages like PHP) to make clear what CodePen Projects does and doesn’t support.

These files could be HTML, CSS, JavaScript, any of the preprocessor types we support, images, fonts, and lots of other types of assets. This makes it easy, for example, to export a repo and move it over to CodePen to play with. The sidebar of a Project is drag-and-drop ready! If you have file on your local machine that you’d like to upload and work with on CodePen, it couldn’t be easier. HTML files are complete documents, so you aren’t limited to our boilerplate HTML structure like you are in the Pen Editor. With Projects, you have complete control over the entire file structure. What if you need multiple HTML files to link between? What if you need partials to include as needed? What if you need to upload other files to work with just for this demo? While that’s super convenient for many types of demos, it can be limiting. That’s different than the Pen Editor on CodePen, which only gives you the HTML, CSS, and JavaScript editor to work with. With CodePen Projects, you get a sidebar of files for you to put whatever files you like. It’s quite a bit different than the Pen Editor, so let’s take a look at all the things it can do!Ī Complete File System, and Complete HTML Files

We just recently launched Projects, the latest big feature over on CodePen.

Pug language atom