LiveCodes
A Code Playground That Just Works!
LiveCodes
LiveCodes is a feature-rich, open-source, client-side code playground that supports React, Vue, Svelte, Solid, JavaScript, TypeScript, CSS, Sass, Tailwind CSS, Python, Go, Ruby, PHP, and 90+ languages/frameworks.
A large number of starter templates are available to help you get started quickly. Projects can be saved, shared, exported (e.g. to GitHub Gists), deployed (e.g. to GitHub Pages), or embedded in web pages. A powerful yet easy-to-use SDK enables the creation of and communication with embedded playgrounds.
With extensive language support and high configurability, LiveCodes can easily adapt to your needs. It offers excellent mobile support, featuring a responsive layout and a touch-friendly code editor.
LiveCodes is an outstanding tool for learning, teaching, prototyping, sharing, and testing code. It can be easily self-hosted, if needed, on any static file server.
LiveCodes is completely free for unlimited use, with no ads and no account required. Its MIT License also permits commercial use.
Docs
Features
- Features
- Projects
- Templates
- CSS
- Result Page
- External Resources
- Tools Pane
- Console
- Compiled Code
- Tests
- Module Resolution
- IntelliSense
- Code Format
- Command Menu
- Keyboard Shortcuts
- User Settings
- Editor Settings
- Internationalization (i18n)
- Default Template/Language
- Assets
- Code Snippets
- Import
- Export
- Share
- Welcome Screen
- Recover Unsaved
- Code to Image
- Display Modes
- Default View
- Themes
- Mobile Support
- Embedded Playgrounds
- Code Prefill
- Lite Mode
- Read-Only
- Permanent URL
- Data URLs
- Deploy
- Sync
- Broadcast
- Backup / Restore
- GitHub Integration
- Integrations
- User Management
- Security
- Self-Hosting
Configuration
SDK
- LiveCodes SDK
- JavaScript/TypeScript SDK
- Preact SDK
- React SDK
- Solid SDK
- Svelte SDK
- Vue SDK
- Web Components SDK
- Headless Mode
Advanced
Languages
- Languages
- art-template
- AsciiDoc
- AssemblyScript
- Astro
- Autoprefixer
- Babel
- BBCode
- Blockly
- Civet
- Clio
- ClojureScript
- CoffeeScript
- Common Lisp
- C/C++ (Wasm)
- C++
- C# (Wasm)
- CSS
- CSS Modules
- cssnano
- Diagrams
- doT
- EJS
- Eta
- Fennel
- Flow
- Gleam
- Go (Wasm)
- Go (Golang)
- Haml
- Handlebars
- HTML
- Imba
- Languages
- Java
- JavaScript
- Jinja
- JSX
- Julia
- Less
- Lightning CSS
- Liquid
- LiveScript
- Lua (Wasm)
- Lua
- Malina.js
- Markdown
- MDX
- MiniZinc
- MJML
- Mustache
- Nunjucks
- OCaml
- Perl
- PHP (Wasm)
- PHP
- PostCSS
- Import Url
- Preset Env
- PostgreSQL
- Prolog
- Pug
- PurgeCSS
- Python (Wasm)
- Python
- R
- React Native (TSX)
- React Native
- React (TSX)
- React
- Reason
- ReScript
- Rich Text Editor
- Riot.js
- Ruby (Wasm)
- Ruby
- Sass
- Scheme
- SCSS
- Solid
- Solid (TS)
- SQL (SQLite)
- Stencil
- Stylis
- Stylus
- Sucrase
- Svelte
- Tailwind CSS
- Tcl
- Teal
- Token CSS
- TSX
- Twig
- TypeScript
- UnoCSS
- Vento
- Vue SFC
- Vue 2 SFC
- WebAssembly Text
- Windi CSS
Tutorials
Docs
- Bookmarklet
- GitHub Action ⚡
- Markdown to LiveCodes
- Contribution
- AI Guide
- Credits
- License
- Sponsor LiveCodes
- Contact
- About us
Display Modes
Internal
Interfaces
- Interface: API
- Interface: AppConfig
- Interface: ContentConfig
- Interface: EditorConfig
- Interface: EditorPosition
- Interface: FormatterConfig
- Interface: TestResult
- Interface: Types
- Interface: UserConfig
Type Aliases
- Type Alias: APICommands
- Type Alias: AppLanguage
- Type Alias: CDN
- Type Alias: CodejarTheme
- Type Alias: CodemirrorTheme
- Type Alias: CssPresetId
- Type Alias: EditorId
- Type Alias: EditorTheme
- Type Alias: MonacoTheme
- Type Alias: Processor
- Type Alias: ScreenName
- Type Alias: TemplateName
- Type Alias: Theme
- Type Alias: ToolName
- Type Alias: ToolsPaneStatus
- Type Alias: WatchCode()
- Type Alias: WatchConsole()
- Type Alias: WatchDestroy()
- Type Alias: WatchLoad()
- Type Alias: WatchReady()
- Type Alias: WatchTests()
Interfaces
Type Aliases
Functions
Meet the modern standard for public facing documentation. Beautiful out of the box, easy to maintain, and optimized for user engagement.
Search through billions of items for similar matches to any object, in milliseconds. It’s the next generation of search, an API call away.
Build and deploy reliable background jobs with no timeouts and no infrastructure to manage.
Get the simple developer experience of SQLite in production, and scale your multi-tenant backend with unlimited databases.
Upstash is a serverless data platform providing low latency and high scalability for real-time applications.
One-click deployments built for teams, tuned for Laravel, loaded with tools and goodies you're going to love.