Skip to main content

An Online IDE for Rapid Web Development

Create a Sandbox, it’s free
browser showing codesandbox running

Get Started Quickly

Use templates to kickstart new projects with no setup.

Template Universe
Start From an Official Template
We've templates for all popular frameworks, from React, Vue, and Angular, to Apollo, Gatsby, Next, and others.
Community-made Starting Points
Use templates made by the community. Bookmark those you find useful to get started with one click.
Make Your Own Templates
Create templates for your specific use-case with the configuration, file structure, and dependencies you need.

Use With Your Fave Dev Tools

We integrate with the tools you already use for a seamless development experience.

Integrated with GitHub

Paste your GitHub URL and get a sandbox that syncs. Or export your sandbox to a GitHub repo, create commits, or open PRs.

Deploy to Vercel or Netlify

Deploy a production version of your sandbox with Vercel or Netlify.

Powered by VS Code

Leverage the power and familiarity of VS Code. Use "Go to Definition," "Replace Occurrences," and set a custom theme.

Prototype Rapidly

Prototype Rapidly
NPM Support
Add any of the 1M+ dependencies on npm directly from the editor.
Hot Module Reloading
With Hot Module Reloading built-in, you can see changes as you make them.
Keybindings and Quick Actions
Use Keybindings and Quick Actions to perform common tasks speedily.
Shareable Links
Every sandbox has a secure URL with HTTPS support for sharing and feedback.
  • "CodeSandbox is a constant joy to use"
    CodeSandbox is a constant joy to useAddy Osmani
  • "It has drastically simplified my life as an OSS maintainer"
    It has drastically simplified my life as an OSS maintainerBrian Vaughn
  • "I ❤️ CodeSandbox"
    I ❤️ CodeSandboxElijah Manor
  • "It is by far the best online code editor I’ve ever used"
    It is by far the best online code editor I’ve ever usedEmma Bostian
  • "I’m so amazed by CodeSandbox! Just epic ❤️"
    I’m so amazed by CodeSandbox! Just epic ❤️Jen Looper
  • "CodeSandbox is one of the best things to ever happen to the internet ♥️♥️♥️"
    CodeSandbox is one of the best things to ever happen to the internet ♥️♥️♥️John Lindquist
  • "Pushing the boundaries of editors! 🔥💪💥"
    Pushing the boundaries of editors! 🔥💪💥Kenneth Auchenberg
  • "CodeSandbox is the best thing that has happened to OSS maintainers"
    CodeSandbox is the best thing that has happened to OSS maintainersMarvin Hagemeister
  • "CodeSandbox continues to amaze me every day 😍"
    CodeSandbox continues to amaze me every day 😍Peggy Rayzis

Collaborate on Code

Collaborate on Code
Go Live
With Live, you can work on code and edit sandboxes together in real-time.
Inline Chat
Chat with collaborators about the code you're all working on.
Classroom Mode
Use Classroom Mode to control who can make edits or watch.

Work with Containers

Create Full-stack Web Apps
Create back-end as well as front-end applications using Node.js.
A Secure Server Control Panel
Restart the sandbox or server, use multiple ports, and add secrets securely.
Terminal Access
Run scripts and commands from a terminal built directly into the editor.

Debug Like a Pro

Debug Like a Pro
Tools like a console, test view, and a problem viewer are in the preview, alongside React's own DevTools.
Jest Integration
We auto-detect and run Jest tests, showing results next to your code.
Error Overlay
See errors clearly with our user-friendly overlay and suggestions on how to solve them.
External Previews
Open your sandbox preview with a separate URL but keep Hot Module Reloading.

Manage Sandboxes with Ease

Organize sandboxes and templates. Search, sort, and filter them. Add them to folders or modify multiple sandboxes at once.
Static File Hosting
Serve all files statically from the public folder, depending on the template.
Public, Private, or Unlisted
Share sandboxes with the world, or set a sandbox to be private or unlisted to hide it from others.
Export to Zip
You can always download your sandbox as a zip if you want to continue locally.

Make It Yours

Configuration UI
Edit config files for npm, Prettier, Netlify, Vercel, TypeScript, JavaScript, and your sandbox easily.
Automatic Type Acquisition
Typings are automatically downloaded for every dependency, so you always have autocompletions.
Code automatically gets prettified on save according to your own Prettier preferences.
You can quickly expand abbreviations with in all JS, HTML, and CSS files.
We show TypeScript autocompletions and diagnostics for TS sandboxes.
All code is linted automatically using the latest version of ESLint.

Join millions of people prototyping what’s next

Create a Sandbox, it’s free