Bricks Component Converter

Client‑side • Paste HTML → JSON
Tip: This version does not fetch remote URLs. Use a CORS proxy Worker if you need that later.
Example HTML
<section class="hero" style="padding:64px;background:#f8fafc">
  <div class="container" style="max-width:960px;margin:0 auto;text-align:center">
    <h1 style="margin:0 0 8px;">Build faster with Bricks</h1>
    <p style="margin:0 0 16px;color:#475569">Paste any static component and convert it to a Bricks-like JSON.</p>
    <a class="btn" href="#" style="padding:12px 20px;background:#111;color:#fff;border-radius:8px">Get started</a>
  </div>
</section>
(Convert to see JSON)
How to use with Bricks
• Use Copy JSON if you want a full JSON file to import as a component library. • Use Copy Elements to paste only the elements array into Bricks’ structure clipboard.
Optional: Cloudflare Worker proxy (for later URL fetch)
export default {
  async fetch(req) {
    const u = new URL(req.url).searchParams.get('url');
    if (!u) return new Response('Missing url', { status: 400 });
    const r = await fetch(u, { headers: { 'User-Agent': 'Mozilla/5.0' } });
    const text = await r.text();
    return new Response(text, {
      headers: {
        'content-type':'text/html; charset=utf-8',
        'access-control-allow-origin':'*'
      }
    });
  }
};