Timeline

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-lg px-6 py-20'><h2 class='text-2xl font-semibold text-black'>Activity</h2><ul class='mt-8'><li class='relative flex gap-4 pb-8'><span class='absolute left-[17px] top-9 h-full w-px bg-neutral-200'></span><span class='relative grid h-9 w-9 shrink-0 place-items-center rounded-full bg-black text-xs font-semibold text-white'>AM</span><div><p class='text-sm text-neutral-700'><span class='font-semibold text-black'>Alex Morgan</span> published Home</p><p class='text-xs text-neutral-400'>2 minutes ago</p></div></li><li class='relative flex gap-4 pb-8'><span class='absolute left-[17px] top-9 h-full w-px bg-neutral-200'></span><span class='relative grid h-9 w-9 shrink-0 place-items-center rounded-full bg-neutral-700 text-xs font-semibold text-white'>SR</span><div><p class='text-sm text-neutral-700'><span class='font-semibold text-black'>Sam Rivera</span> added an animation to Pricing</p><p class='text-xs text-neutral-400'>1 hour ago</p></div></li><li class='relative flex gap-4'><span class='relative grid h-9 w-9 shrink-0 place-items-center rounded-full bg-neutral-500 text-xs font-semibold text-white'>JL</span><div><p class='text-sm text-neutral-700'><span class='font-semibold text-black'>Jordan Lee</span> shared the project</p><p class='text-xs text-neutral-400'>Yesterday</p></div></li></ul></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-4xl px-6 py-24'><div class='divide-y divide-neutral-200 border-y border-neutral-200'><div class='grid gap-4 py-10 sm:grid-cols-[180px_1fr]'><p class='text-5xl font-semibold tracking-tight text-black'>2025</p><div><h3 class='text-xl font-semibold text-black'>The idea</h3><p class='mt-2 text-neutral-600'>A visual editor that keeps plain HTML and Tailwind.</p></div></div><div class='grid gap-4 py-10 sm:grid-cols-[180px_1fr]'><p class='text-5xl font-semibold tracking-tight text-black'>2026</p><div><h3 class='text-xl font-semibold text-black'>First release</h3><p class='mt-2 text-neutral-600'>Editor, code panel, Figma plugin and MCP server.</p></div></div><div class='grid gap-4 py-10 sm:grid-cols-[180px_1fr]'><p class='text-5xl font-semibold tracking-tight text-neutral-300'>2027</p><div><h3 class='text-xl font-semibold text-neutral-400'>What is next</h3><p class='mt-2 text-neutral-400'>Templates and team libraries.</p></div></div></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-3xl px-6 py-24'><h2 class='text-4xl font-semibold tracking-tight text-black'>Release notes</h2><div class='mt-12 space-y-12'><article><div class='flex items-center gap-3'><span class='rounded-md bg-black px-2 py-0.5 font-mono text-xs text-white'>v2.1</span><span class='text-sm text-neutral-400'>12 Nov 2026</span></div><ul class='mt-4 list-disc space-y-2 pl-5 text-neutral-600'><li>Tabs and modal in one click</li><li>Go to frame in the preview</li><li>Small fixes to the code panel</li></ul></article><article><div class='flex items-center gap-3'><span class='rounded-md bg-black px-2 py-0.5 font-mono text-xs text-white'>v2.0</span><span class='text-sm text-neutral-400'>28 Oct 2026</span></div><ul class='mt-4 list-disc space-y-2 pl-5 text-neutral-600'><li>Interactions from the Properties panel</li><li>Config tab beside the code</li></ul></article></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-xl px-6 py-24'><h2 class='text-3xl font-semibold tracking-tight text-black'>Getting set up</h2><ol class='mt-10 space-y-6'><li class='flex gap-4'><span class='grid h-8 w-8 shrink-0 place-items-center rounded-full bg-black text-sm text-white'>✓</span><div><h3 class='font-semibold text-black'>Create an account</h3><p class='text-sm text-neutral-500'>Done</p></div></li><li class='flex gap-4'><span class='grid h-8 w-8 shrink-0 place-items-center rounded-full bg-black text-sm text-white'>✓</span><div><h3 class='font-semibold text-black'>Make a project</h3><p class='text-sm text-neutral-500'>Done</p></div></li><li class='flex gap-4'><span class='grid h-8 w-8 shrink-0 place-items-center rounded-full border-2 border-black text-sm font-semibold text-black'>3</span><div><h3 class='font-semibold text-black'>Add your first page</h3><p class='text-sm text-neutral-600'>Draw or paste. You are here.</p></div></li><li class='flex gap-4'><span class='grid h-8 w-8 shrink-0 place-items-center rounded-full border border-neutral-300 text-sm text-neutral-400'>4</span><div><h3 class='font-semibold text-neutral-400'>Share it</h3></div></li></ol></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-6xl px-6 py-24'><h2 class='text-4xl font-semibold tracking-tight text-black'>Roadmap</h2><div class='mt-12 grid gap-6 md:grid-cols-3'><div><h3 class='flex items-center gap-2 text-sm font-semibold text-black'><span class='h-2 w-2 rounded-full bg-black'></span>Now</h3><div class='mt-4 space-y-3'><div class='rounded-xl border border-neutral-200 p-4 text-sm text-neutral-700'>Templates for common pages</div><div class='rounded-xl border border-neutral-200 p-4 text-sm text-neutral-700'>Test in more browsers</div></div></div><div><h3 class='flex items-center gap-2 text-sm font-semibold text-black'><span class='h-2 w-2 rounded-full border border-black'></span>Next</h3><div class='mt-4 space-y-3'><div class='rounded-xl border border-neutral-200 p-4 text-sm text-neutral-700'>Run interactions while editing</div><div class='rounded-xl border border-neutral-200 p-4 text-sm text-neutral-700'>Shared team libraries</div></div></div><div><h3 class='flex items-center gap-2 text-sm font-semibold text-neutral-500'><span class='h-2 w-2 rounded-full border border-neutral-300'></span>Later</h3><div class='mt-4 space-y-3'><div class='rounded-xl border border-dashed border-neutral-300 p-4 text-sm text-neutral-500'>Comments on frames</div><div class='rounded-xl border border-dashed border-neutral-300 p-4 text-sm text-neutral-500'>Version compare</div></div></div></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-neutral-50'><div class='mx-auto max-w-3xl px-6 py-24'><h2 class='text-4xl font-semibold tracking-tight text-black'>What shipped</h2><div class='mt-12 space-y-6'><div class='grid gap-3 sm:grid-cols-[110px_1fr]'><p class='pt-5 text-sm font-medium text-neutral-500'>12 Nov</p><div class='rounded-2xl border border-neutral-200 bg-white p-5'><h3 class='font-semibold text-black'>Tabs and modal setup</h3><p class='mt-1 text-sm text-neutral-600'>One click to wire up tabs or a modal.</p></div></div><div class='grid gap-3 sm:grid-cols-[110px_1fr]'><p class='pt-5 text-sm font-medium text-neutral-500'>5 Nov</p><div class='rounded-2xl border border-neutral-200 bg-white p-5'><h3 class='font-semibold text-black'>Go to frame</h3><p class='mt-1 text-sm text-neutral-600'>Link one frame to another in the preview.</p></div></div><div class='grid gap-3 sm:grid-cols-[110px_1fr]'><p class='pt-5 text-sm font-medium text-neutral-500'>28 Oct</p><div class='rounded-2xl border border-neutral-200 bg-white p-5'><h3 class='font-semibold text-black'>Config tab</h3><p class='mt-1 text-sm text-neutral-600'>Edit your Tailwind config next to the page.</p></div></div></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-black'><div class='mx-auto max-w-2xl px-6 py-24'><h2 class='text-4xl font-semibold tracking-tight text-white'>Changelog</h2><ol class='relative mt-12 space-y-10 border-l border-neutral-800 pl-8'><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full bg-white'></span><p class='font-mono text-sm text-neutral-500'>v2.1</p><h3 class='mt-1 font-semibold text-white'>Animation library</h3><p class='mt-1 text-neutral-400'>Pick entrances and loops from a library.</p></li><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full bg-white'></span><p class='font-mono text-sm text-neutral-500'>v2.0</p><h3 class='mt-1 font-semibold text-white'>Interactions</h3><p class='mt-1 text-neutral-400'>Menus and modals from one rule.</p></li><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full bg-neutral-600'></span><p class='font-mono text-sm text-neutral-500'>v1.0</p><h3 class='mt-1 font-semibold text-white'>First release</h3><p class='mt-1 text-neutral-400'>The editor, the library and the code panel.</p></li></ol></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-5xl px-6 py-24'><h2 class='text-center text-3xl font-semibold tracking-tight text-black'>Roadmap</h2><div class='relative mt-16 grid gap-10 sm:grid-cols-4'><div class='absolute left-[12%] right-[12%] top-[7px] hidden h-px bg-neutral-200 sm:block'></div><div class='relative text-center'><span class='mx-auto block h-4 w-4 rounded-full bg-black'></span><p class='mt-4 text-sm text-neutral-400'>Q1</p><h3 class='mt-1 font-semibold text-black'>Editor</h3></div><div class='relative text-center'><span class='mx-auto block h-4 w-4 rounded-full bg-black'></span><p class='mt-4 text-sm text-neutral-400'>Q2</p><h3 class='mt-1 font-semibold text-black'>Code panel</h3></div><div class='relative text-center'><span class='mx-auto block h-4 w-4 rounded-full border-2 border-black bg-white'></span><p class='mt-4 text-sm text-neutral-400'>Q3</p><h3 class='mt-1 font-semibold text-black'>Templates</h3></div><div class='relative text-center'><span class='mx-auto block h-4 w-4 rounded-full border-2 border-neutral-300 bg-white'></span><p class='mt-4 text-sm text-neutral-400'>Q4</p><h3 class='mt-1 font-semibold text-neutral-500'>Teams</h3></div></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-4xl px-6 py-24'><h2 class='text-center text-4xl font-semibold tracking-tight text-black'>Milestones</h2><div class='relative mt-14'><div class='absolute left-1/2 top-0 hidden h-full w-px bg-neutral-200 md:block'></div><div class='space-y-10'><div class='grid items-center gap-4 md:grid-cols-2 md:gap-16'><div class='md:text-right'><p class='text-sm text-neutral-400'>2025</p><h3 class='font-semibold text-black'>Idea</h3><p class='text-sm text-neutral-600'>Design where the code lives.</p></div><div></div></div><div class='grid items-center gap-4 md:grid-cols-2 md:gap-16'><div class='hidden md:block'></div><div><p class='text-sm text-neutral-400'>2026</p><h3 class='font-semibold text-black'>First release</h3><p class='text-sm text-neutral-600'>Editor, library and Figma plugin.</p></div></div><div class='grid items-center gap-4 md:grid-cols-2 md:gap-16'><div class='md:text-right'><p class='text-sm text-neutral-400'>2026</p><h3 class='font-semibold text-black'>Interactions</h3><p class='text-sm text-neutral-600'>Behaviour without scripts.</p></div><div></div></div></div></div></div></section>

<link rel='preconnect' href='https://fonts.googleapis.com'><link href='https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700;800&family=Geist+Mono:wght@400;500&display=swap' rel='stylesheet'><script src='https://cdn.tailwindcss.com'></script><script>tailwind.config={theme:{extend:{fontFamily:{sans:['Geist','ui-sans-serif','system-ui','sans-serif'],mono:['Geist Mono','ui-monospace','monospace']}}}}</script><style>body{margin:0;background:#fff;color:#0a0a0a;font-family:Geist,ui-sans-serif,system-ui,sans-serif;-webkit-font-smoothing:antialiased}</style>
        <section class='bg-white'><div class='mx-auto max-w-2xl px-6 py-24'><h2 class='text-4xl font-semibold tracking-tight text-black'>Our story</h2><ol class='relative mt-12 space-y-10 border-l border-neutral-200 pl-8'><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full bg-black'></span><p class='text-sm text-neutral-400'>March 2025</p><h3 class='mt-1 font-semibold text-black'>First prototype</h3><p class='mt-1 text-neutral-600'>A canvas that wrote Tailwind classes.</p></li><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full bg-black'></span><p class='text-sm text-neutral-400'>August 2025</p><h3 class='mt-1 font-semibold text-black'>Code panel</h3><p class='mt-1 text-neutral-600'>HTML, CSS and JS in tabs.</p></li><li class='relative'><span class='absolute -left-[37px] top-1 h-3 w-3 rounded-full border-2 border-black bg-white'></span><p class='text-sm text-neutral-400'>Next</p><h3 class='mt-1 font-semibold text-black'>Templates</h3><p class='mt-1 text-neutral-600'>Starter pages for common layouts.</p></li></ol></div></section>