Pricing Page

<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>
        <div class='bg-white'><header class='mx-auto flex h-16 max-w-3xl items-center px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'></header><main class='mx-auto max-w-3xl px-6 py-16'><h1 class='text-4xl font-semibold tracking-tight text-black'>Pricing</h1><div class='mt-10 divide-y divide-neutral-200 border-y border-neutral-200'><a href='#' class='flex items-center justify-between py-6'><span><span class='block font-semibold text-black'>Free</span><span class='text-sm text-neutral-500'>Try it with three projects.</span></span><span class='text-xl font-semibold text-black'>$0 →</span></a><a href='#' class='flex items-center justify-between py-6'><span><span class='block font-semibold text-black'>Pro</span><span class='text-sm text-neutral-500'>For solo designers and developers.</span></span><span class='text-xl font-semibold text-black'>$12 →</span></a><a href='#' class='flex items-center justify-between py-6'><span><span class='block font-semibold text-black'>Team</span><span class='text-sm text-neutral-500'>Shared libraries and roles.</span></span><span class='text-xl font-semibold text-black'>$29 →</span></a></div></main><footer class='mx-auto max-w-3xl px-6 pb-10 text-sm text-neutral-400'>© 2026 Windcraft. Sample prices.</footer></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto grid max-w-6xl gap-12 px-6 py-24 md:grid-cols-[1fr_1.2fr]'><div><h1 class='text-5xl font-semibold leading-tight tracking-tight text-black'>Pay for what you use.</h1><p class='mt-5 text-lg text-neutral-600'>Start free and move up when your team grows.</p></div><div class='space-y-4'><div class='flex items-center justify-between rounded-2xl border border-neutral-200 p-6'><div><h2 class='font-semibold text-black'>Free</h2><p class='text-sm text-neutral-500'>3 projects</p></div><p class='text-2xl font-semibold text-black'>$0</p></div><div class='flex items-center justify-between rounded-2xl border-2 border-black p-6'><div><h2 class='font-semibold text-black'>Pro</h2><p class='text-sm text-neutral-500'>Unlimited projects</p></div><p class='text-2xl font-semibold text-black'>$12</p></div><div class='flex items-center justify-between rounded-2xl border border-neutral-200 p-6'><div><h2 class='font-semibold text-black'>Team</h2><p class='text-sm text-neutral-500'>Per seat</p></div><p class='text-2xl font-semibold text-black'>$29</p></div></div></main></div>

<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>
        <div class='bg-neutral-50'><header class='border-b border-neutral-200 bg-white'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-3xl px-6 py-20'><h1 class='text-center text-4xl font-semibold tracking-tight text-black'>How many seats?</h1><div class='mt-10 flex justify-center gap-2'><span class='rounded-lg border border-neutral-300 bg-white px-5 py-2.5 text-sm'>3</span><span class='rounded-lg bg-black px-5 py-2.5 text-sm font-medium text-white'>5</span><span class='rounded-lg border border-neutral-300 bg-white px-5 py-2.5 text-sm'>10</span><span class='rounded-lg border border-neutral-300 bg-white px-5 py-2.5 text-sm'>25</span></div><div class='mt-8 grid gap-6 rounded-3xl border border-neutral-200 bg-white p-8 md:grid-cols-[1fr_auto] md:items-center'><div><p class='text-5xl font-semibold text-black'>$145<span class='text-base font-normal text-neutral-500'> / month</span></p><ul class='mt-4 space-y-1.5 text-sm text-neutral-600'><li>✓ Shared libraries</li><li>✓ Roles and review</li></ul></div><a href='#' class='rounded-xl bg-black px-8 py-3.5 text-center text-sm font-semibold text-white'>Start Team plan</a></div></main></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-6xl px-6 py-20'><h1 class='text-center text-5xl font-semibold tracking-tight text-black'>Pricing that scales</h1><div class='mt-12 grid gap-6 md:grid-cols-3'><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Free</h2><p class='mt-3 text-4xl font-semibold text-black'>$0</p></div><div class='rounded-2xl border-2 border-black p-8'><h2 class='font-semibold text-black'>Pro</h2><p class='mt-3 text-4xl font-semibold text-black'>$12</p></div><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Team</h2><p class='mt-3 text-4xl font-semibold text-black'>$29</p></div></div><figure class='mx-auto mt-20 max-w-2xl text-center'><blockquote class='text-2xl font-medium leading-snug text-black'>“Worth it for the time we saved.”</blockquote><figcaption class='mt-3 text-sm text-neutral-500'>Sample Person, Sample Company</figcaption></figure></main><section class='bg-black px-6 py-16 text-center'><h2 class='text-3xl font-semibold text-white'>Start designing today</h2><a href='#' class='mt-6 inline-block rounded-lg bg-white px-7 py-3 text-sm font-semibold text-black'>Open the editor</a></section></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-4xl px-6 py-20'><h1 class='text-center text-5xl font-semibold tracking-tight text-black'>Pricing</h1><div class='mt-12 grid gap-6 md:grid-cols-2'><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Pro</h2><p class='mt-3 text-4xl font-semibold text-black'>$12<span class='text-base font-normal text-neutral-500'>/mo</span></p><a href='#' class='mt-6 block rounded-lg bg-black py-2.5 text-center text-sm font-medium text-white'>Get Pro</a></div><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Team</h2><p class='mt-3 text-4xl font-semibold text-black'>$29<span class='text-base font-normal text-neutral-500'>/seat</span></p><a href='#' class='mt-6 block rounded-lg border border-neutral-300 py-2.5 text-center text-sm font-medium text-black'>Get Team</a></div></div><div class='mt-6 flex flex-wrap items-center justify-between gap-4 rounded-2xl bg-black p-8'><div><h3 class='font-semibold text-white'>Need a custom plan?</h3><p class='mt-1 text-sm text-neutral-400'>We can help with larger teams.</p></div><a href='#' class='rounded-lg bg-white px-5 py-2.5 text-sm font-semibold text-black'>Contact sales</a></div></main></div>

<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>
        <div class='bg-neutral-50'><header class='border-b border-neutral-200 bg-white'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-xl px-6 py-20'><div class='rounded-3xl border border-neutral-200 bg-white p-10 text-center'><p class='text-sm font-medium uppercase tracking-widest text-neutral-500'>One plan</p><p class='mt-4 text-6xl font-semibold text-black'>$19</p><p class='text-neutral-500'>per month</p><ul class='mt-8 space-y-3 text-left text-sm text-neutral-700'><li>✓ Unlimited projects</li><li>✓ Code panel and config</li><li>✓ Interactions and animations</li><li>✓ Figma plugin and MCP server</li></ul><a href='#' class='mt-8 block rounded-xl bg-black py-3 text-sm font-semibold text-white'>Start now</a></div><div class='mt-12 space-y-4 text-sm'><div><p class='font-semibold text-black'>Can I cancel any time?</p><p class='mt-1 text-neutral-600'>Yes.</p></div><div><p class='font-semibold text-black'>Do you offer refunds?</p><p class='mt-1 text-neutral-600'>Sample answer.</p></div></div></main></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-4xl px-6 py-20'><h1 class='text-center text-5xl font-semibold tracking-tight text-black'>Compare plans</h1><div class='mt-12 overflow-x-auto rounded-2xl border border-neutral-200'><table class='w-full text-left text-sm'><thead class='bg-neutral-50 text-black'><tr><th class='px-6 py-4'></th><th class='px-6 py-4 font-semibold'>Free</th><th class='px-6 py-4 font-semibold'>Pro</th><th class='px-6 py-4 font-semibold'>Team</th></tr></thead><tbody class='divide-y divide-neutral-200 text-neutral-600'><tr><td class='px-6 py-4 text-black'>Projects</td><td class='px-6 py-4'>3</td><td class='px-6 py-4'>Unlimited</td><td class='px-6 py-4'>Unlimited</td></tr><tr><td class='px-6 py-4 text-black'>Interactions</td><td class='px-6 py-4'>—</td><td class='px-6 py-4'>✓</td><td class='px-6 py-4'>✓</td></tr><tr><td class='px-6 py-4 text-black'>Shared libraries</td><td class='px-6 py-4'>—</td><td class='px-6 py-4'>—</td><td class='px-6 py-4'>✓</td></tr><tr class='bg-neutral-50 font-medium text-black'><td class='px-6 py-4'>Price</td><td class='px-6 py-4'>$0</td><td class='px-6 py-4'>$12</td><td class='px-6 py-4'>$29</td></tr></tbody></table></div><div class='mt-12 text-center'><a href='#' class='inline-block rounded-lg bg-black px-8 py-3 text-sm font-semibold text-white'>Get started</a></div></main></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-5xl px-6 py-20 text-center'><h1 class='text-5xl font-semibold tracking-tight text-black'>Plans for every team</h1><div class='mt-8 inline-flex rounded-full border border-neutral-200 p-1 text-sm'><span class='rounded-full px-5 py-1.5 text-neutral-600'>Monthly</span><span class='rounded-full bg-black px-5 py-1.5 font-medium text-white'>Yearly</span></div><div class='mt-12 grid gap-6 text-left md:grid-cols-3'><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Starter</h2><p class='mt-3 text-4xl font-semibold text-black'>$0</p></div><div class='rounded-2xl border-2 border-black p-8'><h2 class='font-semibold text-black'>Pro</h2><p class='mt-3 text-4xl font-semibold text-black'>$9<span class='text-base font-normal text-neutral-500'>/mo</span></p></div><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Team</h2><p class='mt-3 text-4xl font-semibold text-black'>$23<span class='text-base font-normal text-neutral-500'>/seat</span></p></div></div><div class='mt-16 flex flex-wrap justify-center gap-x-10 gap-y-3 text-lg font-semibold text-neutral-300'><span>Northwind</span><span>Acme</span><span>Globex</span><span>Initech</span></div></main></div>

<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>
        <div class='bg-black'><header class='border-b border-neutral-800'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo-light.png' alt='Windcraft' class='h-6 w-auto'><a href='#' class='rounded-lg bg-white px-4 py-2 text-sm font-semibold text-black'>Open editor</a></div></header><main class='mx-auto max-w-6xl px-6 py-24'><h1 class='text-center text-5xl font-semibold tracking-tight text-white'>Pick your plan</h1><div class='mt-14 grid gap-6 md:grid-cols-3'><div class='rounded-2xl border border-neutral-800 p-8'><h2 class='font-semibold text-white'>Free</h2><p class='mt-3 text-5xl font-semibold text-white'>$0</p><p class='mt-4 text-sm text-neutral-400'>To try it out.</p></div><div class='rounded-2xl bg-white p-8'><h2 class='font-semibold text-black'>Pro</h2><p class='mt-3 text-5xl font-semibold text-black'>$12</p><p class='mt-4 text-sm text-neutral-600'>For solo work.</p></div><div class='rounded-2xl border border-neutral-800 p-8'><h2 class='font-semibold text-white'>Team</h2><p class='mt-3 text-5xl font-semibold text-white'>$29</p><p class='mt-4 text-sm text-neutral-400'>For teams.</p></div></div></main></div>

<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>
        <div class='bg-white'><header class='border-b border-neutral-200'><div class='mx-auto flex h-16 max-w-6xl items-center justify-between px-6'><img src='https://raw.githubusercontent.com/Tolaj/windcraft/main/docs/media/logo.png' alt='Windcraft' class='h-6 w-auto'><nav class='hidden gap-8 text-sm text-neutral-600 md:flex'><a href='#'>Product</a><a href='#' class='font-medium text-black'>Pricing</a><a href='#'>Docs</a></nav><a href='#' class='rounded-lg bg-black px-4 py-2 text-sm font-medium text-white'>Open editor</a></div></header><main class='mx-auto max-w-6xl px-6 py-20'><div class='text-center'><h1 class='text-5xl font-semibold tracking-tight text-black'>Simple, honest pricing</h1><p class='mt-4 text-lg text-neutral-600'>Sample plans: replace with your own.</p></div><div class='mt-14 grid gap-6 md:grid-cols-3'><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Free</h2><p class='mt-3 text-5xl font-semibold text-black'>$0</p><ul class='mt-6 space-y-2 text-sm text-neutral-600'><li>✓ 3 projects</li><li>✓ Code panel</li></ul><a href='#' class='mt-8 block rounded-lg border border-neutral-300 py-2.5 text-center text-sm font-medium text-black'>Start free</a></div><div class='rounded-2xl bg-black p-8 text-white'><h2 class='font-semibold'>Pro</h2><p class='mt-3 text-5xl font-semibold'>$12</p><ul class='mt-6 space-y-2 text-sm text-neutral-300'><li>✓ Unlimited projects</li><li>✓ Interactions and animations</li></ul><a href='#' class='mt-8 block rounded-lg bg-white py-2.5 text-center text-sm font-semibold text-black'>Get Pro</a></div><div class='rounded-2xl border border-neutral-200 p-8'><h2 class='font-semibold text-black'>Team</h2><p class='mt-3 text-5xl font-semibold text-black'>$29</p><ul class='mt-6 space-y-2 text-sm text-neutral-600'><li>✓ Shared libraries</li><li>✓ Roles</li></ul><a href='#' class='mt-8 block rounded-lg border border-neutral-300 py-2.5 text-center text-sm font-medium text-black'>Contact us</a></div></div><div class='mx-auto mt-20 max-w-2xl divide-y divide-neutral-200 border-y border-neutral-200'><details class='group py-5' open><summary class='flex cursor-pointer list-none justify-between font-medium text-black'>Can I switch plans?<span class='text-neutral-400 transition group-open:rotate-45'>+</span></summary><p class='mt-2 text-neutral-600'>Yes, at any time.</p></details><details class='group py-5'><summary class='flex cursor-pointer list-none justify-between font-medium text-black'>Is there a free trial?<span class='text-neutral-400 transition group-open:rotate-45'>+</span></summary><p class='mt-2 text-neutral-600'>The Free plan has no time limit.</p></details></div></main><footer class='border-t border-neutral-200 px-6 py-6 text-center text-sm text-neutral-500'>© 2026 Windcraft</footer></div>