A live editor that renders HTML/CSS/JS as you type, with 12 starter templates and every J&G Studios API one click away. Render and export to a ZIP for free, no account required. Save to our servers when you’re ready — that’s the subscription. Same editor, same code, you choose where it lives.
CodePen and JSFiddle ship a script-injection-shaped product and call it sandboxed. We mean it: opaque-origin iframe, strict CSP, SRI on every external script.
sandbox="allow-scripts" with no
allow-same-origin. Embedded code can’t read
your parent localStorage, your cookies, your DOM. Even if it
tries.
connect-src 'none', script-src 'self',
no inline-event handlers. The iframe runs your code and
that’s it.
Want React, Three.js, D3? Pick from a curated allowlist where every CDN URL is pinned to an SRI hash. No supply-chain swap mid-flight.
Familiar shape. Edit, save, share via slug URL. Public, unlisted, or private. Fork another pen with one click.
<iframe src=".../embed/<slug>">. Works in Notion, MDX, Hugo, Jekyll, plain HTML. Responsive by
default.
Use your existing Domainless account. Same login as the rest of the ecosystem. No new password to remember.
div.
Or upload programmatically and get back a slug. Either way: it’s an iframe at the end.
<!-- Drop in any page --> <iframe src="https://code.domainless.fun/embed/spinning-cube" style="width:100%; height:400px; border:0" sandbox="allow-scripts" title="Spinning cube demo"></iframe>
# Create a pen programmatically. Returns { slug, url, embed_url }. curl -X POST 'https://api.jandgstudios.fun/v1/code' \ -H 'Authorization: Bearer $JG_API_KEY' \ -H 'Content-Type: application/json' \ -d '{ "title": "Spinning cube", "html": "<div class=\"box\"></div>", "css": ".box { width: 100px; height: 100px; background: #c8a86e; }", "js": "console.log(\"hello\");", "libs": ["three@0.160.0"], "visibility": "public" }'
const res = await fetch('https://api.jandgstudios.fun/v1/code', { method: 'POST', headers: { 'Authorization': `Bearer ${process.env.JG_API_KEY}`, 'Content-Type': 'application/json', }, body: JSON.stringify({ title: 'Demo', html: '<h1>hi</h1>', css: 'h1 { color: rebeccapurple }', js: 'console.log("loaded")', }), }); const { embed_url } = await res.json();
<!-- In MDX, Hugo shortcodes, Astro components: --> <CodeEmbed slug="spinning-cube" height="400" /> <!-- Or vanilla markdown — just an iframe --> <iframe src="https://code.domainless.fun/embed/spinning-cube" style="width:100%;height:400px;border:0" sandbox="allow-scripts"></iframe>
The editor renders in your browser. Exports are generated in your browser. Neither costs anything to use, and we never see your code. Subscribe when you want pens stored on our servers, embedded in your blog, or shared with a slug URL.
Open the editor, pick a template, render it. Hit Export and the ZIP lands in your downloads folder. Move it to a USB stick, pull it onto another machine, ship it however you like — the files are yours.