PageSourceSearch

https://wynter.ai/

html wynter.ai collected 2026-09-24 13:37:07 UTC 46,435 bytes, 923 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en" class="h-full">
3  <head>
4    <title>A suite of tools for building with AI · Wynter</title>
5    <meta name="viewport" content="width=device-width,initial-scale=1">
6    <meta name="apple-mobile-web-app-capable" content="yes">
7    <meta name="application-name" content="Wynter Account">
8    <meta name="mobile-web-app-capable" content="yes">
9    <meta name="theme-color" content="#0a0a0d">
10      <meta name="description" content="Wynter is a suite of tools for AI builders: funnels, web apps, micro-tools, features, video sales letters, and task systems.">
11      <link rel="canonical" href="https://wynter.ai/">
12      <meta property="og:site_name" content="Wynter"><meta property="og:type" content="website">
13      <meta property="og:title" content="A suite of tools for building with AI · Wynter">
14      <meta property="og:description" content="Wynter is a suite of tools for AI builders: funnels, web apps, micro-tools, features, video sales letters, and task systems."><meta property="og:url" content="https://wynter.ai/">
15      <meta property="og:image" content="https://wynter.ai/wynterai-logo.png">
16      <meta name="twitter:card" content="summary"><meta name="twitter:title" content="Wynter — A suite of tools for building with AI">
17      <meta name="twitter:description" content="Wynter is a suite of tools for AI builders: funnels, web apps, micro-tools, features, video sales letters, and task systems."><meta name="twitter:image" content="https://wynter.ai/wynterai-logo.png">
18      
18<script type="application/ld+json">{"@context":"https://schema.org","@type":"Organization","name":"Wynter","url":"https://wynter.ai/","logo":"https://wynter.ai/wynterai-logo.png"}</script>
18
19    <meta name="csrf-param" content="authenticity_token" />
20<meta name="csrf-token" content="W3Bhk1pc5ZJamMRrDv6XfA6JRnfYkuEgkZYApWZGC31PZr4rxP0XmS7t6VYiH8thy48l5Hdx3wKCFl7VaVUHjw" />
21    
22
23    <link rel="alternate" type="application/rss+xml" title="Wynter — the blog" href="/blog/feed.xml">
24
25    
26
27
28    <link rel="icon" href="/favicon.ico" sizes="32x32">
29    <link rel="icon" href="/favicon-16x16.png" sizes="16x16" type="image/png">
30    <link rel="icon" href="/favicon-32x32.png" sizes="32x32" type="image/png">
31    <link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
32
33    <link rel="preconnect" href="https://fonts.googleapis.com">
34    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
35    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
36
37    <link rel="stylesheet" href="/assets/application-8b441ae0.css" data-turbo-track="reload" />
38<link rel="stylesheet" href="/assets/tailwind-640a0a76.css" data-turbo-track="reload" />
39    
39<script type="importmap" data-turbo-track="reload">{
40  "imports": {
41    "application": "/assets/application-bfcdf840.js",
42    "@hotwired/turbo-rails": "/assets/turbo.min-9fd88cd5.js",
43    "@hotwired/stimulus": "/assets/stimulus.min-4b1e420e.js",
44    "@hotwired/stimulus-loading": "/assets/stimulus-loading-1fc53fe7.js",
45    "controllers/application": "/assets/controllers/application-3affb389.js",
46    "controllers/clipboard_controller": "/assets/controllers/clipboard_controller-4441d9e8.js",
47    "controllers/dialog_controller": "/assets/controllers/dialog_controller-581b28c0.js",
48    "controllers/dropdown_controller": "/assets/controllers/dropdown_controller-92daa0ba.js",
49    "controllers/email_preview_controller": "/assets/controllers/email_preview_controller-7646aee9.js",
50    "controllers/filestack_controller": "/assets/controllers/filestack_controller-8042b4eb.js",
51    "controllers/hello_controller": "/assets/controllers/hello_controller-708796bd.js",
52    "controllers": "/assets/controllers/index-ee64e1f1.js",
53    "controllers/markdown_preview_controller": "/assets/controllers/markdown_preview_controller-f68265ad.js",
54    "controllers/widget_preview_controller": "/assets/controllers/widget_preview_controller-ad3ca536.js"
55  }
56}</script>
56
57<link rel="modulepreload" href="/assets/application-bfcdf840.js">
58<link rel="modulepreload" href="/assets/turbo.min-9fd88cd5.js">
59<link rel="modulepreload" href="/assets/stimulus.min-4b1e420e.js">
60<link rel="modulepreload" href="/assets/stimulus-loading-1fc53fe7.js">
61<link rel="modulepreload" href="/assets/controllers/application-3affb389.js">
62<link rel="modulepreload" href="/assets/controllers/clipboard_controller-4441d9e8.js">
63<link rel="modulepreload" href="/assets/controllers/dialog_controller-581b28c0.js">
64<link rel="modulepreload" href="/assets/controllers/dropdown_controller-92daa0ba.js">
65<link rel="modulepreload" href="/assets/controllers/email_preview_controller-7646aee9.js">
66<link rel="modulepreload" href="/assets/controllers/filestack_controller-8042b4eb.js">
67<link rel="modulepreload" href="/assets/controllers/hello_controller-708796bd.js">
68<link rel="modulepreload" href="/assets/controllers/index-ee64e1f1.js">
69<link rel="modulepreload" href="/assets/controllers/markdown_preview_controller-f68265ad.js">
70<link rel="modulepreload" href="/assets/controllers/widget_preview_controller-ad3ca536.js">
71<script type="module">import "application"</script>
71
72
73      
73<script async src="https://plausible.io/js/pa-Eb1Jatn_Ag-FqhYBHlcUk.js"></script>
73
74  
74<script>
75    window.plausible = window.plausible || function () { (plausible.q = plausible.q || []).push(arguments) };
76    plausible.init = plausible.init || function (i) { plausible.o = i || {} };
77    plausible.init();
78  </script>
78
79
80  </head>
81
82  <body class="flex h-full min-h-screen flex-col">
83    
84
85    <main class="w-full flex-1">
86      
87      
88<div class="backdrop" aria-hidden="true">
89  <div class="backdrop-grid"></div>
90  <div class="backdrop-glow backdrop-glow-a"></div>
91  <div class="backdrop-glow backdrop-glow-b"></div>
92</div>
93
94
95<div class="relative">
96  <aside class="absolute left-5 top-5 z-20 hidden w-[26rem] items-center gap-3 overflow-hidden rounded-full border border-white/10 bg-[#1f2023] py-1.5 pl-3 pr-1.5 shadow-xl shadow-black/40 lg:flex"
97       aria-label="OverSkill">
98  <img alt="OverSkill" width="319" height="64" loading="lazy" class="h-4 w-auto shrink-0" src="/brand/overskill-logo.png" />
99
100  <span class="h-4 w-px shrink-0 bg-white/10" aria-hidden="true"></span>
101
102  <div class="marquee min-w-0 flex-1">
103    <div class="marquee-track text-[11px] leading-none text-white/65">
104      <span class="marquee-item">
105        Build apps in minutes complete with payments, auth and much more. Join the OverSkill waitlist! Made by Todd Dickerson and Russell Brunson
106      </span>
107      <span class="marquee-item" aria-hidden="true">
108        Build apps in minutes complete with payments, auth and much more. Join the OverSkill waitlist! Made by Todd Dickerson and Russell Brunson
109      </span>
110    </div>
111  </div>
112
113  <a href="https://overskillgames.com/?ref=ddp98bze"
114     target="_blank" rel="noopener sponsored"
115     class="btn btn-sm shrink-0 rounded-full border border-[#2f7a49]
116            bg-[linear-gradient(180deg,#84e29e_0%,#4dc470_100%)] text-[#0d2417]
117            shadow-[inset_0_1px_0_rgb(255_255_255/0.40)]
118            hover:bg-[linear-gradient(180deg,#95ebac_0%,#5bd07e_100%)]">
119    Join Waitlist
120  </a>
121</aside>
122
123</div>
124
125<nav class="relative mx-auto flex max-w-6xl items-center justify-end gap-1 px-5 pt-5">
126  <a class="btn-ghost btn-sm" href="#pricing">Pricing</a>
127  <a class="btn-ghost btn-sm" href="/blog">Blog</a>
128</nav>
129
130<section class="relative mx-auto max-w-4xl px-5 pb-10 pt-8 text-center sm:pb-12 sm:pt-12">
131  <div class="flex justify-center">
132    
133<img alt="Wynter" width="510" height="250" class="h-20 w-auto select-none" draggable="false" src="/assets/logo-c846ad1b.png" />
134
135  </div>
136
137  <h1 class="mt-7 text-[2rem] font-semibold leading-[1.12] tracking-tight text-ink-50 sm:mt-8 sm:text-5xl lg:text-6xl">
138    <span class="block">A suite of tools</span>
139    <span class="block">for building with AI.</span>
140  </h1>
141
142  <p class="mx-auto mt-5 max-w-xl text-lg leading-relaxed text-ink-300 sm:mt-6">
143    Funnels, web apps, micro-tools, features, video sales letters, task systems.
144    Each one hands your AI a real blueprint to build from instead of a blank
145    prompt — so you start from a plan, not a guess.
146  </p>
147
148  <div class="mx-auto mt-7 flex w-full max-w-64 flex-col items-stretch gap-3 sm:max-w-none sm:flex-row sm:justify-center">
149    <a class="btn-primary btn-lg" href="/sign-up">Create free account</a>
150    <a class="btn-secondary btn-lg" href="/session/new">Sign in</a>
151  </div>
152
153  <p class="mt-5 text-sm text-ink-400">
154    No password to set. We email you a sign-in&nbsp;link.
155  </p>
156</section>
157
158<section class="relative mx-auto max-w-4xl px-5 pb-9" data-controller="dialog">
159  <button type="button" data-action="dialog#open"
160          class="mx-auto flex items-center gap-3.5 rounded-full border border-ink-800 bg-ink-900/70 py-2 pl-2 pr-5 text-left transition hover:border-ink-600 hover:bg-ink-800/70">
161    <img alt="" width="512" height="512" loading="lazy" class="h-11 w-11 shrink-0 rounded-full object-cover ring-1 ring-ink-700" src="/brand/wynter-avatar.jpg" />
162    <span class="min-w-0">
163      <span class="block text-sm font-semibold text-ink-50">Wynter Jones</span>
164      <span class="block text-xs text-ink-400">Builds all of it &middot; <span class="text-signal-400">read the story</span></span>
165    </span>
166  </button>
167
168  <dialog data-dialog-target="dialog"
169          class="w-[min(40rem,calc(100vw-2rem))] rounded-2xl border border-ink-700 bg-ink-900 p-0 text-ink-100 backdrop:bg-black/70 backdrop:backdrop-blur-sm">
170    <div class="max-h-[85vh] overflow-y-auto p-6 sm:p-8">
171      <div class="flex items-start justify-between gap-4">
172        <div class="flex items-center gap-4">
173          <img alt="" width="512" height="512" class="h-16 w-16 shrink-0 rounded-full object-cover ring-1 ring-ink-700" src="/brand/wynter-avatar.jpg" />
174          <div>
175            <h2 class="text-xl font-semibold tracking-tight text-ink-50">Wynter Jones</h2>
176            <p class="mt-0.5 text-sm text-ink-400">25 years building web apps</p>
177          </div>
178        </div>
179
180        <button type="button" data-action="dialog#close" aria-label="Close"
181                class="btn-ghost btn-sm -mr-2 -mt-1 shrink-0">
182          <svg class="h-4 w-4" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
183               stroke-linecap="round" aria-hidden="true"><path d="m5 5 10 10M15 5 5 15"></path></svg>
184        </button>
185      </div>
186
187      <div class="mt-6 space-y-4 text-sm leading-relaxed text-ink-300">
188        <p>
189          Twenty-five years of building web apps, most of it on the marketing side of the
190          internet where the thing either converts or it doesn't.
191        </p>
192        <p>
193          Worked with <span class="text-ink-100">Russell Brunson</span> and
194          <span class="text-ink-100">Todd Dickerson</span> on ClickFunnels Classic, and has
195          since built <span class="text-ink-100">MarketingSecrets.AI</span>,
196          <span class="text-ink-100">Driven67</span> and
197          <span class="text-ink-100">BarnumPT</span>.
198        </p>
199      </div>
200
201      <figure class="mt-7">
202        <figcaption class="eyebrow mb-2 text-ink-400">Still shipping</figcaption>
203        <img alt="GitHub contribution graph showing 6,607 contributions in the last year" width="1552" height="392" loading="lazy" class="w-full rounded-lg border border-ink-800" src="/brand/wynter-github-contributions.png" />
204      </figure>
205    </div>
206  </dialog>
207</section>
208
209
210<section class="relative mx-auto max-w-3xl px-5 pb-12 sm:pb-16">
211  <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
212    <div class="voomly-embed"
213         data-id="iKeFSVlIbE1lt3RCViFjavDzXFgPZ7JWBOkBJBojpkYM90RdW"
214         data-ratio="1.777778" data-type="v" data-skin-color="rgba(0,0,0,1)" data-shadow=""
215         style="width: 100%; aspect-ratio: 1.77778 / 1; background: linear-gradient(45deg, rgb(142, 150, 164) 0%, rgb(201, 208, 222) 100%);"></div>
216  </figure>
217</section>
218<script src="https://embed.voomly.com/embed/embed-build.js" defer></script>
218
219
220  <section class="relative mx-auto max-w-4xl px-5 pb-8" aria-labelledby="suite-heading">
221    <h2 id="suite-heading" class="eyebrow text-center text-ink-300">What's in the suite</h2>
222
223    <ul class="mt-5 grid grid-cols-1 gap-2 sm:grid-cols-2 lg:grid-cols-3">
224        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
225    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://dothesetasks.com/icon.png?v=3" />
226
227    <img alt="DoTheseTasks" loading="lazy" class="h-[26px] w-auto shrink-0" src="/network/wordmarks/do_these_tasks.png" />
228
229</li>
230
231        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
232    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://addthisfeature.com/icon.png?v=3" />
233
234    <img alt="AddThisFeature" loading="lazy" class="h-[26px] w-auto shrink-0" src="/network/wordmarks/add_this_feature.png" />
235
236</li>
237
238        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
239    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://wynter.ai/network/buildthiswebapp.svg" />
240
241    <span class="truncate text-sm font-medium text-ink-100">BuildThisWebApp</span>
242
243</li>
244
245        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
246    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://buildthisfunnel.com/icon.png?v=3" />
247
248    <img alt="BuildThisFunnel" loading="lazy" class="h-[26px] w-auto shrink-0" src="/network/wordmarks/build_this_funnel.png" />
249
250</li>
251
252        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
253    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://buildthistool.com/icon.png?v=3" />
254
255    <img alt="BuildThisTool" loading="lazy" class="h-[26px] w-auto shrink-0" src="/network/wordmarks/build_this_tool.png" />
256
257</li>
258
259        <li class="flex items-center justify-center gap-2.5 rounded-tile border border-ink-800 bg-ink-900/70 px-3 py-2.5">
260    <img alt="" loading="lazy" class="h-7 w-7 shrink-0 rounded-md object-cover ring-1 ring-ink-700" src="https://url2vsl.com/icon.png?v=5" />
261
262    <img alt="URL2VSL" loading="lazy" class="h-[26px] w-auto shrink-0" src="/network/wordmarks/url2vsl.png" />
263
264</li>
265
266    </ul>
267
268    <p class="mx-auto mt-6 max-w-lg text-center text-sm leading-relaxed text-ink-400">
269      A Wynter.ai Account opens every one of them. The Suite plan unlocks the premium
270      features inside, and AI credits are shared across the whole&nbsp;suite.
271    </p>
272  </section>
273
274  <div class="relative border-t border-ink-800/80 mt-6 divide-y divide-ink-800/60">
275      
276<section class="relative py-16 sm:py-24" aria-labelledby="app-do_these_tasks">
277  <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-2 lg:gap-16">
278    <div class="">
279      <div class="flex items-center gap-3">
280          <img alt="" loading="lazy" width="100" height="100" class="h-9 w-9 shrink-0 rounded-lg object-cover ring-1 ring-ink-700" src="https://dothesetasks.com/icon.png?v=3" />
281          <img alt="DoTheseTasks" loading="lazy" class="h-6 w-auto" src="/network/wordmarks/do_these_tasks.png" />
282      </div>
283
284      <p class="mt-5">
285        <span class="badge bg-signal-500/10 text-signal-200 ring-1 ring-inset ring-signal-500/25">
286          Included in the Wynter.ai suite
287        </span>
288      </p>
289
290      <h3 id="app-do_these_tasks" class="mt-4 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
291        Hand your agent a URL. Get the work back done.
292      </h3>
293
294      <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
295        Mark up a screenshot, publish the list as a private URL, and your agent works through it one task at a time. Screenshot in, finished task out — no project manager in the middle.
296      </p>
297
298        <a href="https://dothesetasks.com"
299           class="btn-secondary mt-7" target="_blank" rel="noopener">
300          Visit DoTheseTasks
301          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
302     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
303  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
304</svg>
305
306        </a>
307    </div>
308
309    <div class="">
310      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
311        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
312          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
313          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
314          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
315          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">
316            dothesetasks.com
317          </p>
318        </div>
319        <img alt="The DoTheseTasks editor, showing a marked-up screenshot beside its task list." loading="lazy" width="1600" height="1000" class="block w-full" src="/network/shots/do_these_tasks.jpg" />
320      </figure>
321    </div>
322  </div>
323</section>
324
325      
326<section class="relative py-16 sm:py-24" aria-labelledby="app-add_this_feature">
327  <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-2 lg:gap-16">
328    <div class="lg:order-2">
329      <div class="flex items-center gap-3">
330          <img alt="" loading="lazy" width="100" height="100" class="h-9 w-9 shrink-0 rounded-lg object-cover ring-1 ring-ink-700" src="https://addthisfeature.com/icon.png?v=3" />
331          <img alt="AddThisFeature" loading="lazy" class="h-6 w-auto" src="/network/wordmarks/add_this_feature.png" />
332      </div>
333
334      <p class="mt-5">
335        <span class="badge bg-signal-500/10 text-signal-200 ring-1 ring-inset ring-signal-500/25">
336          Included in the Wynter.ai suite
337        </span>
338      </p>
339
340      <h3 id="app-add_this_feature" class="mt-4 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
341        Your app works. Now make it better.
342      </h3>
343
344      <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
345        Stop losing days to features you have built a hundred times. Grab a link, hand it to your agent, and it builds the feature into the app you already have — your stack, your components, your design system.
346      </p>
347
348        <a href="https://addthisfeature.com"
349           class="btn-secondary mt-7" target="_blank" rel="noopener">
350          Visit AddThisFeature
351          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
352     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
353  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
354</svg>
355
356        </a>
357    </div>
358
359    <div class="lg:order-1">
360      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
361        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
362          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
363          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
364          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
365          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">
366            addthisfeature.com
367          </p>
368        </div>
369        <img alt="The AddThisFeature catalog: a list of features beside a detail panel with what-it-does and how-it-works notes." loading="lazy" width="1600" height="1000" class="block w-full" src="/network/shots/add_this_feature.jpg" />
370      </figure>
371    </div>
372  </div>
373</section>
374
375      
376<section class="relative py-16 sm:py-24" aria-labelledby="app-build_this_web_app">
377  <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-2 lg:gap-16">
378    <div class="">
379      <div class="flex items-center gap-3">
380          <img alt="" loading="lazy" width="100" height="100" class="h-9 w-9 shrink-0 rounded-lg object-cover ring-1 ring-ink-700" src="https://wynter.ai/network/buildthiswebapp.svg" />
381          <p class="text-base font-semibold text-ink-50">BuildThisWebApp</p>
382      </div>
383
384      <p class="mt-5">
385        <span class="badge bg-signal-500/10 text-signal-200 ring-1 ring-inset ring-signal-500/25">
386          Included in the Wynter.ai suite
387        </span>
388      </p>
389
390      <h3 id="app-build_this_web_app" class="mt-4 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
391        Plan the app. Then let AI build it.
392      </h3>
393
394      <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
395        A one-line idea turns into the brief your AI coder actually needs: research, PRD, design direction, mockups, and a copy-paste build prompt. Or start from a plan somebody already finished.
396      </p>
397
398        <a href="https://buildthiswebapp.com"
399           class="btn-secondary mt-7" target="_blank" rel="noopener">
400          Visit BuildThisWebApp
401          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
402     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
403  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
404</svg>
405
406        </a>
407    </div>
408
409    <div class="">
410      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
411        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
412          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
413          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
414          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
415          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">
416            buildthiswebapp.com
417          </p>
418        </div>
419        <img alt="The BuildThisWebApp planner, showing a generated brief for a web application." loading="lazy" width="1600" height="1000" class="block w-full" src="/network/shots/build_this_web_app.jpg" />
420      </figure>
421    </div>
422  </div>
423</section>
424
425      
426<section class="relative py-16 sm:py-24" aria-labelledby="app-build_this_funnel">
427  <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-2 lg:gap-16">
428    <div class="lg:order-2">
429      <div class="flex items-center gap-3">
430          <img alt="" loading="lazy" width="100" height="100" class="h-9 w-9 shrink-0 rounded-lg object-cover ring-1 ring-ink-700" src="https://buildthisfunnel.com/icon.png?v=3" />
431          <img alt="BuildThisFunnel" loading="lazy" class="h-6 w-auto" src="/network/wordmarks/build_this_funnel.png" />
432      </div>
433
434      <p class="mt-5">
435        <span class="badge bg-signal-500/10 text-signal-200 ring-1 ring-inset ring-signal-500/25">
436          Included in the Wynter.ai suite
437        </span>
438      </p>
439
440      <h3 id="app-build_this_funnel" class="mt-4 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
441        Your app knows the offer. Now build the funnel.
442      </h3>
443
444      <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
445        Pick a funnel type and hand one link to the AI builder that already knows your app. It gets the pattern, the edge cases, and the build checklist in a format it can actually use.
446      </p>
447
448        <a href="https://buildthisfunnel.com"
449           class="btn-secondary mt-7" target="_blank" rel="noopener">
450          Visit BuildThisFunnel
451          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
452     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
453  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
454</svg>
455
456        </a>
457    </div>
458
459    <div class="lg:order-1">
460      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
461        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
462          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
463          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
464          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
465          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">
466            buildthisfunnel.com
467          </p>
468        </div>
469        <img alt="The BuildThisFunnel catalog: a list of funnel blueprints beside a detail panel with its copy-prompt block." loading="lazy" width="1600" height="1000" class="block w-full" src="/network/shots/build_this_funnel.jpg" />
470      </figure>
471    </div>
472  </div>
473</section>
474
475      
476<section class="relative py-16 sm:py-24" aria-labelledby="app-build_this_tool">
477  <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-2 lg:gap-16">
478    <div class="">
479      <div class="flex items-center gap-3">
480          <img alt="" loading="lazy" width="100" height="100" class="h-9 w-9 shrink-0 rounded-lg object-cover ring-1 ring-ink-700" src="https://buildthistool.com/icon.png?v=3" />
481          <img alt="BuildThisTool" loading="lazy" class="h-6 w-auto" src="/network/wordmarks/build_this_tool.png" />
482      </div>
483
484      <p class="mt-5">
485        <span class="badge bg-signal-500/10 text-signal-200 ring-1 ring-inset ring-signal-500/25">
486          Included in the Wynter.ai suite
487        </span>
488      </p>
489
490      <h3 id="app-build_this_tool" class="mt-4 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
491        Your app has the context. Now build the tool.
492      </h3>
493
494      <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
495        The calculator, quiz, or scorecard your buyers would actually stop and use — specified down to the edge cases, ready to hand straight to your coding agent.
496      </p>
497
498        <a href="https://buildthistool.com"
499           class="btn-secondary mt-7" target="_blank" rel="noopener">
500          Visit BuildThisTool
501          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
502     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
503  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
504</svg>
505
506        </a>
507    </div>
508
509    <div class="">
510      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/40">
511        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
512          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
513          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
514          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
515          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">
516            buildthistool.com
517          </p>
518        </div>
519        <img alt="The BuildThisTool catalog: micro-tool ideas beside a detail panel with its build spec." loading="lazy" width="1600" height="1000" class="block w-full" src="/network/shots/build_this_tool.jpg" />
520      </figure>
521    </div>
522  </div>
523</section>
524
525  </div>
526
527
528<section class="relative border-t border-ink-800/80 pt-20 sm:pt-28" aria-labelledby="open-source-heading">
529  <div class="mx-auto max-w-4xl px-5 text-center">
530    <p class="eyebrow text-ink-300">Free &amp; open source</p>
531    <h2 id="open-source-heading" class="mt-3 text-3xl font-semibold tracking-tight text-ink-50 sm:text-4xl">
532      Three tools I built for myself, then gave&nbsp;away.
533    </h2>
534    <p class="mx-auto mt-5 max-w-2xl text-base leading-relaxed text-ink-300">
535      No account, no plan, nothing to buy. They run on your own machine, and the
536      source is there to read. They are not part of the suite — they are just
537      what came out of building it.
538    </p>
539  </div>
540
541  <article class="relative isolate overflow-hidden py-16 sm:py-24">
542    <div class="absolute -right-24 top-1/2 -z-10 h-[520px] w-[520px] -translate-y-1/2 rounded-full bg-[#36b3a6]/[0.13] blur-[130px]"
543         aria-hidden="true"></div>
544    <img alt="" loading="lazy" width="560" height="560" class="pointer-events-none absolute -right-20 -top-10 -z-10 hidden w-[360px] opacity-[0.07] lg:block" aria-hidden="true" src="/network/open-source/nabu-owl.png" />
545
546    <div class="mx-auto grid max-w-6xl items-center gap-10 px-5 lg:grid-cols-[0.85fr_1.15fr] lg:gap-14">
547      <div>
548        <img alt="Nabu.sh" loading="lazy" width="821" height="592" class="h-20 w-auto" src="/network/open-source/nabu-wordmark.webp" />
549
550        <div class="mt-5 flex flex-wrap items-center gap-2">
551          <span class="badge bg-[#36b3a6]/15 text-[#6fd8c9] ring-1 ring-inset ring-[#36b3a6]/30">Free &amp; open source</span>
552          <span class="badge bg-ink-800 text-ink-300">macOS &amp; Linux</span>
553          <span class="badge bg-ink-800 text-ink-300">Runs on your machine</span>
554        </div>
555
556        <h3 class="mt-6 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
557          Codex works in bursts. Nabu works the whole&nbsp;shift.
558        </h3>
559
560        <p class="mt-4 max-w-xl text-base leading-relaxed text-ink-300">
561          A local, always-on operator that owns your missions, queue, approvals
562          and schedules, then hands the real work to Codex. It starts with your
563          computer, keeps everything in <span class="font-mono text-ink-100">~/.nabu</span>,
564          and never opens a port to the internet.
565        </p>
566
567        <p class="mt-6 overflow-x-auto rounded-lg border border-ink-800 bg-ink-950 px-4 py-3 font-mono text-[13px] text-ink-200">
568          <span class="text-ink-600">$</span> curl -fsSL https://nabu.sh/install.sh | bash
569        </p>
570
571        <a href="https://nabu.sh" target="_blank" rel="noopener"
572           class="btn-secondary mt-6 border-[#36b3a6]/40 hover:border-[#36b3a6]/70">
573          Visit nabu.sh
574          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
575     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
576  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
577</svg>
578
579        </a>
580      </div>
581
582      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/50">
583        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
584          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
585          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
586          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
587          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">127.0.0.1:7777</p>
588        </div>
589        <img alt="Nabu&#39;s chat, where a mission is steered and the agent reports back" loading="lazy" width="2400" height="1500" class="block w-full" src="/network/open-source/nabu-shot.webp" />
590      </figure>
591    </div>
592  </article>
593
594  <article class="relative isolate overflow-hidden py-16 sm:py-24">
595    <div class="absolute left-1/2 top-24 -z-10 h-[560px] w-[860px] -translate-x-1/2 rounded-full bg-[#ff3d94]/[0.10] blur-[150px]"
596         aria-hidden="true"></div>
597
598    <div class="mx-auto max-w-6xl px-5">
599      <div class="max-w-2xl">
600        <img alt="OpenPaw" loading="lazy" width="660" height="192" class="h-11 w-auto" src="/network/open-source/openpaw-wordmark.png" />
601
602        <div class="mt-5 flex flex-wrap items-center gap-2">
603          <span class="badge bg-[#ff3d94]/15 text-[#ff8cc0] ring-1 ring-inset ring-[#ff3d94]/30">Free &amp; open source</span>
604          <span class="badge bg-ink-800 text-ink-300">Single Go binary</span>
605          <span class="badge bg-ink-800 text-ink-300">npx, and it runs</span>
606        </div>
607
608        <h3 class="mt-6 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
609          Cats with jobs. The purrductivity&nbsp;layer.
610        </h3>
611
612        <p class="mt-4 text-base leading-relaxed text-ink-300">
613          Chat with agents that build real tools — compiled Go services, not
614          prompts. Give them a job and they go and do it, hand work to each
615          other, and keep your dashboards refreshing around the clock for zero
616          tokens.
617        </p>
618      </div>
619
620      <div class="relative mt-10 rounded-2xl border border-[#ff3d94]/25 bg-[#1a0d16] p-4 pb-24 shadow-2xl shadow-black/50 sm:p-6 sm:pb-28 lg:pb-16">
621        <figure class="overflow-hidden rounded-xl border border-ink-800 bg-ink-950">
622          <img alt="Two OpenPaw agents delegating a task between themselves in chat" loading="lazy" width="2012" height="1440" class="block max-h-[440px] w-full object-cover object-top" src="/network/open-source/openpaw-shot.webp" />
623        </figure>
624
625        <img alt="" loading="lazy" width="1536" height="1024" class="pointer-events-none absolute -bottom-8 -right-3 w-48 drop-shadow-[0_18px_28px_rgba(0,0,0,0.65)] sm:-bottom-12 sm:-right-6 sm:w-64 lg:-bottom-14 lg:-right-12 lg:w-80" aria-hidden="true" src="/network/open-source/openpaw-cats.webp" />
626      </div>
627
628      <div class="mt-8">
629        <a href="https://openpaw.wynter.ai" target="_blank" rel="noopener"
630           class="btn-secondary border-[#ff3d94]/40 hover:border-[#ff3d94]/70">
631          Visit openpaw.wynter.ai
632          <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
633     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
634  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
635</svg>
636
637        </a>
638      </div>
639    </div>
640  </article>
641
642  <article class="relative isolate overflow-hidden py-16 sm:py-24">
643    <div class="absolute left-1/2 top-10 -z-10 h-[420px] w-[900px] -translate-x-1/2 roun
643ded-full bg-[#e8b44a]/[0.10] blur-[140px]"
644         aria-hidden="true"></div>
645
646    <div class="mx-auto max-w-3xl px-5 text-center">
647      <img alt="Workbench" loading="lazy" width="660" height="157" class="mx-auto h-12 w-auto" src="/network/open-source/workbench-wordmark.png" />
648
649      <div class="mt-5 flex flex-wrap items-center justify-center gap-2">
650        <span class="badge bg-[#e8b44a]/15 text-[#f0cb80] ring-1 ring-inset ring-[#e8b44a]/30">Free &amp; open source</span>
651        <span class="badge bg-ink-800 text-ink-300">Apple Silicon</span>
652        <span class="badge bg-ink-800 text-ink-300">Signed &amp; notarized</span>
653      </div>
654
655      <h3 class="mt-6 text-2xl font-semibold tracking-tight text-ink-50 sm:text-3xl">
656        Your best work is rotting in a folder called
657        <span class="text-[#e8b44a]">test-2-final</span>.
658      </h3>
659
660      <p class="mx-auto mt-4 max-w-xl text-base leading-relaxed text-ink-300">
661        Workbench finds every project on your drive, runs the ones you trust,
662        takes a real screenshot of each, and puts them all on one shelf. It is
663        not lost. It was just unlabelled.
664      </p>
665
666      <a href="https://workbench.wynter.ai" target="_blank" rel="noopener"
667         class="btn-secondary mt-7 border-[#e8b44a]/40 hover:border-[#e8b44a]/70">
668        Visit workbench.wynter.ai
669        <svg class="h-3.5 w-3.5" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
670     stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
671  <path d="M7.5 4.5h8v8M15.5 4.5 4.5 15.5"></path>
672</svg>
673
674      </a>
675    </div>
676
677    <div class="mx-auto mt-12 max-w-6xl px-5">
678      <figure class="overflow-hidden rounded-xl border border-ink-700 bg-ink-900 shadow-2xl shadow-black/50">
679        <div class="flex items-center gap-1.5 border-b border-ink-800 bg-ink-850 px-3.5 py-2.5">
680          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
681          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
682          <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
683          <p class="ml-2 truncate font-mono text-[11px] text-ink-500">Workbench — Library</p>
684        </div>
685        <img alt="Workbench&#39;s library: 38 scanned projects, a commit heatmap, and filters across the top" loading="lazy" width="1440" height="530" class="block w-full" src="/network/open-source/workbench-shot.png" />
686      </figure>
687    </div>
688  </article>
689</section>
690
691
692<section class="relative border-t border-ink-800/80 py-20 sm:py-28" aria-labelledby="prompting-heading">
693  <div class="mx-auto max-w-3xl px-5">
694    <div class="text-center">
695      <p class="eyebrow text-ink-300">Expert-level prompting</p>
696      <h2 id="prompting-heading" class="mt-3 text-3xl font-semibold tracking-tight text-ink-50 sm:text-4xl">
697        A real prompt. It worked&nbsp;first&nbsp;time.
698      </h2>
699    </div>
700
701    <figure class="mt-10 overflow-hidden rounded-xl border border-ink-700 bg-[#0c0c0f] shadow-2xl shadow-black/40">
702      <div class="flex items-center gap-1.5 border-b border-ink-800 px-3.5 py-2.5">
703        <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
704        <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
705        <span class="h-2.5 w-2.5 rounded-full bg-ink-700" aria-hidden="true"></span>
706        <p class="ml-2 font-mono text-[11px] text-ink-600">wynter — building this page</p>
707      </div>
708
709      <blockquote class="px-4 py-5 font-mono text-[13px] leading-7 text-ink-200 sm:px-6">
710        <span class="select-none text-signal-500" aria-hidden="true">&rsaquo;&nbsp;</span>
711        <span class="text-ink-500">pasted-image_339ad867.png</span>
712        can you <span class="typo">centere</span> these in <span class="typo">theri</span>
713        boxes so it looks <span class="typo">nicers</span>
714      </blockquote>
715    </figure>
716
717    <p class="mx-auto mt-8 max-w-xl text-center text-base leading-relaxed text-ink-300">
718      Three typos, no punctuation, and a screenshot pasted in the middle of the sentence.
719      The boxes got centred. That is the bar now — you have to know what you want, not how
720      to phrase&nbsp;it.
721    </p>
722
723    <p class="mt-4 text-center text-sm text-ink-500">
724      Which is roughly the idea behind all of this: hand the model something specific,
725      and let it do the typing.
726    </p>
727  </div>
728</section>
729
730
731
732<section class="relative border-t border-ink-800/80 py-20 sm:py-28" id="pricing" aria-labelledby="pricing-heading">
733  <div class="mx-auto max-w-6xl px-5">
734    <div class="mx-auto max-w-2xl text-center">
735      <p class="eyebrow text-ink-300">Pricing</p>
736      <h2 id="pricing-heading" class="mt-3 text-3xl font-semibold tracking-tight text-ink-50 sm:text-4xl">
737        Start free. Upgrade only if you hit the ceiling.
738      </h2>
739      <p class="mt-4 text-base leading-relaxed text-ink-300">
740        One plan for the premium layer in every app, and metered credits bought separately.
741        No per-app tier, no seat count, and no annual lock to get the real&nbsp;price.
742      </p>
743    </div>
744
745    <div class="mt-14 grid gap-5 lg:grid-cols-3">
746      <article class="card flex h-full flex-col p-7">
747        <p class="text-sm font-semibold text-ink-300">Free</p>
748        <p class="mt-4 flex items-baseline gap-1.5">
749          <span class="text-4xl font-semibold tracking-tight text-ink-50">$0</span>
750          <span class="text-sm text-ink-500">forever</span>
751        </p>
752        <p class="mt-3 text-sm leading-relaxed text-ink-400">Enough to actually ship something.</p>
753
754        <ul class="mt-7 space-y-3 text-sm text-ink-300">
755            <li class="flex items-start gap-2.5">
756  <svg class="mt-0.5 h-4 w-4 shrink-0 text-ink-500"
757       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
758       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
759    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
760  </svg>
761  <span>Every app in the suite, open</span>
762</li>
763
764            <li class="flex items-start gap-2.5">
765  <svg class="mt-0.5 h-4 w-4 shrink-0 text-ink-500"
766       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
767       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
768    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
769  </svg>
770  <span>The full catalog in each one, free to read and copy</span>
771</li>
772
773            <li class="flex items-start gap-2.5">
774  <svg class="mt-0.5 h-4 w-4 shrink-0 text-ink-500"
775       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
776       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
777    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
778  </svg>
779  <span>A Wynter.ai Account across all of them</span>
780</li>
781
782            <li class="flex items-start gap-2.5">
783  <svg class="mt-0.5 h-4 w-4 shrink-0 text-ink-500"
784       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
785       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
786    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
787  </svg>
788  <span>No card, no trial clock</span>
789</li>
790
791        </ul>
792
793        <div class="mt-auto pt-8">
794          <a class="btn-secondary w-full" href="/sign-up">Create your free account</a>
795        </div>
796      </article>
797
798      <article class="card relative flex h-full flex-col border-signal-500/40 bg-signal-500/[0.04] p-7">
799        <span class="absolute -top-3 left-7 badge bg-signal-500 text-ink-950">Unlocks every app</span>
800        <p class="text-sm font-semibold text-signal-200">Wynter Suite</p>
801        <p class="mt-4 flex items-baseline gap-1.5">
802          <span class="text-4xl font-semibold tracking-tight text-ink-50">$28</span>
803          <span class="text-sm text-ink-500">/month</span>
804        </p>
805        <p class="mt-3 text-sm leading-relaxed text-ink-400">
806          Premium in every Wynter app, for one monthly price.
807        </p>
808
809        <ul class="mt-7 space-y-3 text-sm text-ink-300">
810            <li class="flex items-start gap-2.5">
811  <svg class="mt-0.5 h-4 w-4 shrink-0 text-signal-400"
812       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
813       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
814    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
815  </svg>
816  <span>Everything in Free</span>
817</li>
818
819            <li class="flex items-start gap-2.5">
820  <svg class="mt-0.5 h-4 w-4 shrink-0 text-signal-400"
821       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
822       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
823    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
824  </svg>
825  <span>Site scans — five picks written for your own offer</span>
826</li>
827
828            <li class="flex items-start gap-2.5">
829  <svg class="mt-0.5 h-4 w-4 shrink-0 text-signal-400"
830       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
831       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
832    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
833  </svg>
834  <span>Customise any blueprint to your stack</span>
835</li>
836
837            <li class="flex items-start gap-2.5">
838  <svg class="mt-0.5 h-4 w-4 shrink-0 text-signal-400"
839       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
840       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
841    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
842  </svg>
843  <span>Collections and saved work</span>
844</li>
845
846            <li class="flex items-start gap-2.5">
847  <svg class="mt-0.5 h-4 w-4 shrink-0 text-signal-400"
848       viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="2"
849       stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
850    <path d="m4.5 10.5 3.5 3.5 7.5-8"></path>
851  </svg>
852  <span>Cancel any time, keep your work</span>
853</li>
854
855        </ul>
856
857        <div class="mt-auto pt-8">
858          <a class="btn-primary w-full" href="/sign-up">Start free, upgrade later</a>
859        </div>
860      </article>
861
862      <article class="card flex h-full flex-col p-7">
863        <p class="text-sm font-semibold text-ink-300">Credits</p>
864        <p class="mt-4 flex items-baseline gap-1.5">
865          <span class="text-4xl font-semibold tracking-tight text-ink-50">$5</span>
866          <span class="text-sm text-ink-500">and up</span>
867        </p>
868        <p class="mt-3 text-sm leading-relaxed text-ink-400">
869          Metered AI usage. Shared across every app, and it never expires.
870        </p>
871
872        <ul class="mt-7 divide-y divide-ink-800 border-y border-ink-800">
873            <li class="flex items-baseline justify-between py-2.5 text-sm">
874              <span class="text-ink-200">500 credits</span>
875              <span class="font-mono text-ink-400">$5</span>
876            </li>
877            <li class="flex items-baseline justify-between py-2.5 text-sm">
878              <span class="text-ink-200">1,500 credits</span>
879              <span class="font-mono text-ink-400">$12</span>
880            </li>
881            <li class="flex items-baseline justify-between py-2.5 text-sm">
882              <span class="text-ink-200">5,000 credits</span>
883              <span class="font-mono text-ink-400">$35</span>
884            </li>
885        </ul>
886
887        <p class="mt-5 text-sm leading-relaxed text-ink-400">
888          Bought separately from the plan on purpose, so you are never paying monthly for usage
889          you did not have. Free and paid accounts buy the same packs.
890        </p>
891
892        <div class="mt-auto pt-8">
893          <a class="btn-secondary w-full" href="/sign-up">Get an account first</a>
894        </div>
895      </article>
896    </div>
897  </div>
898</section>
899
900
901    </main>
902
903    <footer class="mt-20 border-t border-ink-800 bg-ink-900">
904  <div class="mx-auto max-w-6xl px-5 py-12">
905    <div class="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
906      <p class="font-mono text-xs text-ink-600">
907        &copy; 2026 Wynter
908      </p>
909
910      <nav class="flex items-center gap-5 text-xs">
911        <a class="text-ink-500 hover:text-ink-200" href="/blog">Blog</a>
912        <a class="text-ink-500 hover:text-ink-200" href="/terms">Terms</a>
913        <a class="text-ink-500 hover:text-ink-200" href="/privacy">Privacy</a>
914
915
916      </nav>
917    </div>
918  </div>
919</footer>
920
921
922  </body>
923</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.