Welcome to Codeframe.

The simplest, easiest, fastest way to build a webpage.

Try it live!

This is the Codeframe editor. Change the HTML, CSS, or JavaScript code on the right pane to see the changes in the left pane.

Code, Share, Remix

You can build webpages in Codeframe with HTML, CSS, and JavaScript in seconds, share your work with just a link, and remix Codeframes from other people with your ideas.

From idea to code to live site in seconds

Open a new Codeframe, start typing, and hit Preview to see your code in action in seconds. Your code should run at the speed of your ideas, and Codeframe is built for speed.

Share with anyone with just a link

Each Codeframe has a unique link that points to a specific version of the project. This makes it super easy to share a Codeframe site or code to anyone in the world with an internet connection –– just send a link!

Read and remix projects from everyone else

Every Codeframe site's source code is public and remixable on Codeframe. This means you can find a project you like and build on top of it to make it your own, then share it so others can remix your ideas.

Starter Templates

Intro to HTML + CSS

Just getting introduced to the web with HTML or CSS? Start here with projects that use HTML and CSS to build simple webpages.

JavaScript Experiments

JavaScript adds a limitless layer of interactivity over HTML and CSS to make our webpages dynamic. Dive into these JS-focused examples to start building more powerful web pages and applications.

Built with Torus

Torus is a lightweight JavaScript library for building fast, dynamic web apps like Codeframe (which is powered by Torus). You can explore simple Torus apps in these examples.

Who? What? Why?

So. Why did I make this? Well,

I like to work on side projects all the time. My computer is littered with quick, small projects from random late nights and weekends where I found some time to start hacking on random ideas entertain myself or make my life less repetitive. But as I built more and more projects, I saw that the least interesting part about starting a new idea –– setting everything up, configuring files and scripts –– was also the biggest deterrent to my creativity.

So I started another side project! Enter Codeframe.

I started building Codeframe to solve this problem: it's meant to be the fastest way to go from idea to code running on a live webpage that can be shared with anyone on the planet. Everything from the technical stack from top to bottom, to the simplicity of the UI, to the fact that Torus comes included into every Codeframe, is designed with the goal of speed of creativity in mind.

I also frequently run into opportunities to teach web design and development, and find myself wanting something more lightweight and approachable than CodePen, Glitch, and Repl.it, which are fantastic alternatives but often too heavy or complex for beginners in web development. For these times, Codeframe is meant to be a simpler, more approachable alternative.

But above all, Codeframe exists to make it easier to learn how to make things on the web, and to make it faster and more painless to build things for the web. If you're a maker of beautiful things on the Internet, I hope you give Codeframe a try, and I hope you love it.

If you have questions, comments, or feedback, please come find me! I'm on Twitter and GitHub @thesephist.