Material UI Playground
Unsaved
Preview
✦
AI Chat
Share
Publish
Sign In
Sign Up
FILES
src
App.jsx
index.jsx
index.html
package.json
Items: 0
NPM PACKAGES
react
18.2.0
react-dom
18.2.0
@mui/material
5.14.0
@emotion/react
11.11.0
@emotion/styled
11.11.0
Items: 0
AI Chat
Untitled
New Chat
Hi! I'm your AI builder.
Pick a starting point or just describe what you need.
Business landing page
Online store
SaaS or startup
Portfolio
Restaurant or cafe
Real estate
Beauty or wellness
Blog or magazine
Attach
Visual edits
Economy
Preview
1
My Projects
New project...
Remix this project
Rename project
Checkpoints
Save
Project
Share
Preferences
Appearance
Help
Quick Actions...
⌘+k
Sign In
Sign Up
Save checkpoint
Checkpoint 1 (Default)
How it works
Archive
Download
Import from AI
Save
Publish
Project settings
Copy Link
Copy Published URL
Share to Web
Allow Editing
View
AI Model
Transcription
Preview
Editor
Code Style
Code Assist
Keymap
Language
Clear Cache & Reload
System
Light
Blue
Gray
Dark
Project Not Saved
Save your project first to share it with others.
Save Project
Deployment
Publish
http://mui.playcode.io
Custom Subdomain
PRO
.playcode.io
Custom Domains
PRO
Add custom domain
Need help to setup custom domain?
Click here
.
Open
Default
Delete
Default Project
Live Reload
SPA Mode
Show PlayCode Badge
Live View Delay
Loop Protection
Production Build
Minify
Keep Names
Tree Shaking
Sidebar
⌘+b
Console
⌘+j
Preview
⌘+⇧+v
AI Chat
⌘+⇧+c
Economy Model (Fast)
Quality Model (Pro)
Gemini 3 Flash
GPT-5.3 Codex
GPT-5.4
Claude Opus 4.6
Claude Sonnet 4.6
Claude Haiku 4.5
Grok 4.1 Fast Reasoning
Grok 4.1 Fast
Grok Code Fast
GLM 5.1
Gemini 3.1 Pro
Gemini 3.1 Flash Lite
Gemini 3 Flash
GPT-5.3 Codex
GPT-5.4
Claude Opus 4.6
Claude Sonnet 4.6
Claude Haiku 4.5
Grok 4.1 Fast Reasoning
Grok 4.1 Fast
Grok Code Fast
GLM 5.1
Gemini 3.1 Pro
Gemini 3.1 Flash Lite
Language
Auto-send voice messages
Auto-detect
English
Russian
Spanish
Portuguese
German
French
Turkish
Japanese
Korean
Italian
Preview Run on Opening
Preview Zoom
Preview Background (White)
Font Size
Tab Size
Line Numbers
Minimap
Line Wrap
Hard Wrap Column
Tabs for Indent
Formatter Semicolons
Single Quotes
Syntax Validation
Autocompletion
Hover Information
Emmet
Default
Vim
🇺🇸 English
🇪🇸 Español
🇧🇷 Português
🇩🇪 Deutsch
🇫🇷 Français
🇹🇷 Türkçe
🇷🇺 Русский
🇯🇵 日本語
🇰🇷 한국어
🇮🇹 Italiano
Hire an Expert
Online Chat
Help & Support
Report Abuse
Report a Bug
Roadmap
Changelog
Keyboard Shortcuts
Privacy Policy
Social
PlayCode v2026.7.39
Discord
X / Twitter
Add Images
AI can see and analyze images
Add Files
AI can see and analyze images
No chats yet
Rename Chat
Delete Chat
HTML Pages
index.html
/index.html
Zoom
White Background