PageSourceSearch

https://tyga.ai/docs

html tyga.ai collected 2026-10-05 15:08:54 UTC 46,861 bytes, 848 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3<head>
4  <meta charset="UTF-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6  <title>tyga.ai | Build Full-Stack Apps with AI + AnyDBInstance</title>
7  <meta name="description" content="tyga.ai is the only AI app builder with native AnyDBInstance integration. 23 domain templates, one-click deploy, connect your database in seconds.">
8  <meta name="theme-color" content="#000000">
9
10  <!-- Open Graph -->
11  <meta property="og:title" content="tyga.ai | Build Full-Stack Apps with AI + AnyDBInstance">
12  <meta property="og:description" content="The only AI app builder with native AnyDBInstance database integration. 23 templates, deploy in minutes.">
13  <meta property="og:type" content="website">
14  <meta property="og:url" content="https://tyga.ai">
15  <meta property="og:image" content="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/og-image.jpg">
16
17  <!-- Twitter Card -->
18  <meta name="twitter:card" content="summary_large_image">
19  <meta name="twitter:title" content="tyga.ai | Build Full-Stack Apps with AI + AnyDBInstance">
20  <meta name="twitter:description" content="The only AI app builder with native AnyDBInstance database integration. 23 templates, deploy in minutes.">
21  <meta name="twitter:image" content="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/og-image.jpg">
22
23  <!-- Structured Data -->
24  
24<script type="application/ld+json">
25  {
26    "@context": "https://schema.org",
27    "@type": "SoftwareApplication",
28    "name": "tyga.ai",
29    "applicationCategory": "DeveloperApplication",
30    "operatingSystem": "Web",
31    "description": "AI-powered full-stack app builder with native AnyDBInstance integration. 23 domain templates.",
32    "offers": {
33      "@type": "Offer",
34      "price": "0",
35      "priceCurrency": "USD"
36    }
37  }
38  </script>
38
39
40  <link rel="icon" type="image/x-icon" href="/favicon.ico">
41  <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
42  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
43  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
44  <link rel="stylesheet" href="/css/animations.css">
45  <link rel="stylesheet" href="/css/landing.css">
46</head>
47<body data-theme="light">
48
49  <!-- ==================== NAVIGATION ==================== -->
50  <header class="landing-nav" id="nav">
51    <div class="nav-inner">
52      <a href="/" class="nav-logo"><img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/tyga.ai/tygaai-black-words.svg" alt="tyga.ai" height="32"></a>
53      <ul class="nav-links" id="navLinks">
54        <li><a href="#features">Features</a></li>
55        <li><a href="#database">Database</a></li>
56        <li><a href="#pricing">Pricing</a></li>
57        <li><a href="#templates">Templates</a></li>
58      </ul>
59      <div class="nav-right">
60        <button class="theme-toggle" id="themeToggle" aria-label="Toggle theme">&#9790;</button>
61        <a href="/app" class="btn-primary-landing">Start Building</a>
62        <button class="hamburger" id="hamburger" aria-label="Menu">&#9776;</button>
63      </div>
64    </div>
65  </header>
66
67  <main>
68
69    <!-- ==================== 1. HERO ==================== -->
70    <section class="hero" id="hero">
71      <div class="container">
72        <div class="hero-grid">
73          <div class="hero-text">
74            <div class="hero-badge">
75              <span class="hero-badge-dot"></span>
76              The AI builder with a real database
77            </div>
78            <h1>Describe it.<br><span class="hero-accent">Ship it.</span><br>Database included.</h1>
79            <p class="hero-sub">23 website categories. Native AnyDBInstance integration. One prompt to full-stack app with MongoDB, PostgreSQL, or MySQL.</p>
80            <div class="hero-ctas">
81              <a href="/app" class="btn-primary-landing btn-lg">Start Building Free</a>
82              <a href="#database" class="btn-outline-landing btn-lg">See the Database &#8594;</a>
83            </div>
84            <div class="hero-proof">
85              <div class="hero-proof-item"><strong>23</strong> templates</div>
86              <div class="hero-proof-sep"></div>
87              <div class="hero-proof-item"><strong>3</strong> DB engines</div>
88              <div class="hero-proof-sep"></div>
89              <div class="hero-proof-item"><strong>~700</strong> tokens per site</div>
90            </div>
91          </div>
92          <div class="hero-visual">
93            <div class="hero-showcase">
94              <div class="hero-reel hero-reel-up">
95                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/saas.jpg" alt="SaaS" loading="eager">
96                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/ecommerce.jpg" alt="E-Commerce" loading="eager">
97                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/dashboard.jpg" alt="Dashboard" loading="eager">
98                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/blog.jpg" alt="Blog" loading="eager">
99                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/healthcare.jpg" alt="Healthcare" loading="eager">
100                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/fitness.jpg" alt="Fitness" loading="eager">
101                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/portfolio.jpg" alt="Portfolio" loading="eager">
102                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/event.jpg" alt="Event" loading="eager">
103                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/travel.jpg" alt="Travel" loading="eager">
104                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/music.jpg" alt="Music" loading="eager">
105                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/nonprofit.jpg" alt="Nonprofit" loading="eager">
106                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/wedding.jpg" alt="Wedding" loading="eager">
107                <!-- duplicate for seamless loop -->
108                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/saas.jpg" alt="SaaS">
109                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/ecommerce.jpg" alt="E-Commerce">
110                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/dashboard.jpg" alt="Dashboard">
111                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/blog.jpg" alt="Blog">
112                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/healthcare.jpg" alt="Healthcare">
113                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/fitness.jpg" alt="Fitness">
114                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/portfolio.jpg" alt="Portfolio">
115                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/event.jpg" alt="Event">
116                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/travel.jpg" alt="Travel">
117                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/music.jpg" alt="Music">
118                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/nonprofit.jpg" alt="Nonprofit">
119                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/wedding.jpg" alt="Wedding">
120              </div>
121              <div class="hero-reel hero-reel-down">
122                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/restaurant.jpg" alt="Restaurant" loading="eager">
123                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/education.jpg" alt="Education" loading="eager">
124                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/editorial.jpg" alt="Editorial" loading="eager">
125                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/developer-tools.jpg" alt="Dev Tools" loading="eager">
126                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/project-management.jpg" alt="Project Management" loading="eager">
127                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/product-management.jpg" alt="Product Management" loading="eager">
128                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/real-estate.jpg" alt="Real Estate" loading="eager">
129                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/services.jpg" alt="Services" loading="eager">
130                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/resume.jpg" alt="Resume" loading="eager">
131                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/photography.jpg" alt="Photography" loading="eager">
132                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/landing-page.jpg" alt="Landing Page" loading="eager">
133                <!-- duplicate for seamless loop -->
134                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/restaurant.jpg" alt="Restaurant">
135                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/education.jpg" alt="Education">
136                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/editorial.jpg" alt="Editorial">
137                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/developer-tools.jpg" alt="Dev Tools">
138                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/project-management.jpg" alt="Project Management">
139                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/product-management.jpg" alt="Product Management">
140                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/real-estate.jpg" alt="Real Estate">
141                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/services.jpg" alt="Services">
142                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/resume.jpg" alt="Resume">
143                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/photography.jpg" alt="Photography">
144                <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/vibeasite.com/templates/landing-page.jpg" alt="Landing Page">
145              </div>
146            </div>
147          </div>
148        </div>
149      </div>
150    </section>
151
152    <!-- ==================== 2. DATABASE (promoted — the USP) ==================== -->
153    <section id="database" class="db-section">
154      <div class="container">
155        <div class="db-grid">
156          <div class="db-text reveal">
157            <div class="db-badge">
158              <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"/><path d="M3 12c0 1.66 4 3 9 3s9-1.34 9-3"/></svg>
159              AnyDBInstance
160            </div>
161            <h2 class="db-heading">The only AI builder<br>with a <span class="db-accent">real database</span></h2>
162            <p class="db-sub">Connect AnyDBInstance in one click. MongoDB, PostgreSQL, or MySQL. Auto-schema, visual panel, CRUD operations, and generated client code.</p>
163            <ul class="db-checks">
164              <li><span class="db-check">&#10003;</span> Multi-engine: MongoDB, PostgreSQL, MySQL</li>
165              <li><span class="db-check">&#10003;</span> Auto-schema from 10 template categories</li>
166              <li><span class="db-check">&#10003;</span> Visual database panel in the editor</li>
167              <li><span class="db-check">&#10003;</span> Auto-generated client code (anydb.ts)</li>
168              <li><span class="db-check">&#10003;</span> Free AnyDBInstance tier included</li>
169            </ul>
170          </div>
171          <div class="db-terminal reveal delay-2">
172            <div class="db-terminal-bar">
173              <span class="db-dot" style="background:#ef4444"></span>
174              <span class="db-dot" style="background:#f59e0b"></span>
175              <span class="db-dot" style="background:#22c55e"></span>
176              <span class="db-terminal-title">anydb.ts</span>
177            </div>
178<pre class="db-code"><code><span class="db-c-comment">// Connect your database</span>
179<span class="db-c-keyword">import</span> anydb <span class="db-c-keyword">from</span> <span class="db-c-string">"@/lib/anydb"</span>;
180
181<span class="db-c-keyword">const</span> users = <span class="db-c-keyword">await</span> anydb.<span class="db-c-fn">collection</span>(<span class="db-c-string">"users"</span>);
182
183<span class="db-c-comment">// Query with filters</span>
184<span class="db-c-keyword">const</span> admins = <span class="db-c-keyword">await</span> users.<span class="db-c-fn">find</span>({
185  role: <span class="db-c-string">"admin"</span>,
186  active: <span class="db-c-bool">true</span>
187});
188
189<span class="db-c-comment">// Insert a document</span>
190<span class="db-c-keyword">await</span> users.<span class="db-c-fn">insertOne</span>({
191  name: <span class="db-c-string">"Alice"</span>,
192  email: <span class="db-c-string">"[email protected]"</span>,
193  plan: <span class="db-c-string">"pro"</span>
194});</code></pre>
195          </div>
196        </div>
197      </div>
198    </section>
199
200    <!-- ==================== 3. SOCIAL PROOF ==================== -->
201    <section class="social-proof">
202      <div class="container">
203        <div class="proof-grid">
204          <div class="proof-item reveal">
205            <div class="proof-number" data-target="23">0</div>
206            <div class="proof-label">Domain Templates</div>
207            <div class="proof-detail">SaaS, ecommerce, restaurant, and more</div>
208          </div>
209          <div class="proof-item reveal delay-1">
210            <div class="proof-number">Native</div>
211            <div class="proof-label">Database Integration</div>
212            <div class="proof-detail">Powered by AnyDBInstance</div>
213          </div>
214          <div class="proof-item reveal delay-2">
215            <div class="proof-number">One-click</div>
216            <div class="proof-label">Deploy &amp; Publish</div>
217            <div class="proof-detail">Custom domains + free subdomains</div>
218          </div>
219          <div class="proof-item reveal delay-3">
220            <div class="proof-number" data-target="700" data-prefix="~">0</div>
221            <div class="proof-label">Tokens per site</div>
222            <div class="proof-detail">10x more efficient than competitors</div>
223          </div>
224        </div>
225      </div>
226    </section>
227
228    <!-- ==================== 4. COMPARISON TABLE ==================== -->
229    <section id="comparison" style="background:var(--bg-secondary);">
230      <div class="container">
231        <p class="section-label reveal">Who Is Each Tool For?</p>
232        <h2 class="section-title reveal delay-1">Find the right builder for your use case</h2>
233        <div class="comparison-wrapper reveal delay-2">
234          <table class="comparison-table">
235            <thead>
236              <tr>
237                <th>Dimension</th>
238                <th class="highlight">tyga.ai</th>
239                <th>Lovable</th>
240                <th>Bolt</th>
241                <th>v0</th>
242              </tr>
243            </thead>
244            <tbody>
245              <tr>
246                <td>Best for</td>
247                <td class="highlight">Full-stack apps with data</td>
248                <td>UI prototypes</td>
249                <td>Quick demos</td>
250                <td>Component generation</td>
251              </tr>
252              <tr>
253                <td>ICP</td>
254                <td class="highlight">Founders, freelancers, agencies</td>
255                <td>Designers</td>
256                <td>Developers</td>
257                <td>Frontend devs</td>
258              </tr>
259              <tr>
260                <td>
260Database integration</td>
261                <td class="highlight"><span class="check">&#10003;</span> AnyDBInstance (Mongo/PG/MySQL)</td>
262                <td>Supabase (separate account)</td>
263                <td>✕</td>
264                <td>✕</td>
265              </tr>
266              <tr>
267                <td>Domain templates</td>
268                <td class="highlight">23 categories</td>
269                <td>0 (blank canvas)</td>
270                <td>Limited</td>
271                <td>Partial</td>
272              </tr>
273              <tr>
274                <td>Multi-agent AI</td>
275                <td class="highlight"><span class="check">&#10003;</span> 5 specialized agents</td>
276                <td>✕</td>
277                <td>✕</td>
278                <td>✕</td>
279              </tr>
280              <tr>
281                <td>Code export</td>
282                <td class="highlight"><span class="check">&#10003;</span> OAuth + sync</td>
283                <td><span class="check">&#10003;</span></td>
284                <td><span class="check">&#10003;</span></td>
285                <td>Partial</td>
286              </tr>
287              <tr>
288                <td>Custom domains</td>
289                <td class="highlight"><span class="check">&#10003;</span></td>
290                <td><span class="check">&#10003;</span></td>
291                <td><span class="check">&#10003;</span></td>
292                <td>✕</td>
293              </tr>
294              <tr>
295                <td>Pay-as-you-go credits</td>
296                <td class="highlight"><span class="check">&#10003;</span> From $5</td>
297                <td>✕ subscription only</td>
298                <td>✕ subscription only</td>
299                <td>✕</td>
300              </tr>
301              <tr>
302                <td>Design themes</td>
303                <td class="highlight">5 included</td>
304                <td>✕</td>
305                <td>✕</td>
306                <td>✕</td>
307              </tr>
308              <tr>
309                <td>Multi-agent arch</td>
310                <td class="highlight"><span class="check">&#10003;</span> 5 agents</td>
311                <td>✕</td>
312                <td>✕</td>
313                <td>✕</td>
314              </tr>
315              <tr>
316                <td>Token efficiency</td>
317                <td class="highlight">~700/site</td>
318                <td>~10,000+</td>
319                <td>~5,000+</td>
320                <td>~3,000+</td>
321              </tr>
322            </tbody>
323          </table>
324        </div>
325      </div>
326    </section>
327
328    <!-- ==================== 5. FEATURES ==================== -->
329    <section id="features">
330      <div class="container">
331        <p class="section-label reveal">Features</p>
332        <h2 class="section-title reveal delay-1">Everything you need to ship</h2>
333
334        <!-- Two hero features: the USPs -->
335        <div class="feat-heroes">
336          <div class="feat-hero feat-hero-db reveal">
337            <div class="feat-hero-icon feat-hero-icon-db">
338              <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5"/><path d="M3 12c0 1.66 4 3 9 3s9-1.34 9-3"/></svg>
339            </div>
340            <div>
341              <h3>Native Database Integration</h3>
342              <p>Connect AnyDBInstance in one click. MongoDB, PostgreSQL, or MySQL. The only AI builder that ships with a real backend.</p>
343            </div>
344          </div>
345          <div class="feat-hero feat-hero-tpl reveal delay-1">
346            <div class="feat-hero-icon feat-hero-icon-tpl">
347              <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>
348            </div>
349            <div>
350              <h3>23 Domain Templates</h3>
351              <p>SaaS, ecommerce, restaurant, healthcare, fitness, wedding, and 17 more. Each with tailored sections, content, and database schemas.
351</p>
352            </div>
353          </div>
354        </div>
355
356        <!-- Supporting features: smaller, varied, less prominent -->
357        <div class="feat-grid">
358          <div class="feat-card reveal delay-1">
359            <div class="feat-card-num">01</div>
360            <h4>Multi-Agent AI</h4>
361            <p>5 specialized agents: architect, codewriter, validator, fixer, slotwriter. Orchestrated, not guessing.</p>
362          </div>
363          <div class="feat-card reveal delay-2">
364            <div class="feat-card-num">02</div>
365            <h4>~700 Token Builds</h4>
366            <p>10x more efficient than competitors. LLN compression means less thinking, faster shipping.</p>
367          </div>
368          <div class="feat-card reveal delay-3">
369            <div class="feat-card-num">03</div>
370            <h4>Deploy or Download</h4>
371            <p>Free subdomain, custom domain for $5/mo, or download the full ZIP and host on Vercel, Netlify, anywhere.</p>
372          </div>
373          <div class="feat-card reveal delay-4">
374            <div class="feat-card-num">04</div>
375            <h4>Full Code Export</h4>
376            <p>Every project is git-versioned. Download clean React + Tailwind or Bootstrap source code.</p>
377          </div>
378        </div>
379      </div>
380    </section>
381
382    <!-- ==================== 6. PRICING ==================== -->
383    <section id="pricing" style="background:var(--bg-secondary);">
384      <div class="container">
385        <p class="section-label reveal">Pricing</p>
386        <h2 class="section-title reveal delay-1">Simple pricing. Try any plan free for 7 days.</h2>
387        <p class="section-subtitle reveal delay-2">Start free with 5 credits/day. Upgrade when you're ready — $0 today, first charge on day 7. Cancel anytime.</p>
388
389        <!-- Free + subscription tiers -->
390        <div class="pricing-layout pricing-grid-4">
391          <!-- Free tier -->
392          <div class="pricing-card reveal" style="padding:1.75rem;">
393            <h3>Free</h3>
394            <div class="pricing-price">$0</div>
395            <div class="pricing-period">no card required</div>
396            <ul class="pricing-features">
397              <li>5 credits/day (auto-reset)</li>
398              <li>AI-powered generation</li>
399              <li>23 domain templates</li>
400              <li>5 design themes</li>
401              <li>Subdomain hosting</li>
402            </ul>
403            <a href="/app" class="btn-outline-landing pricing-btn-full">Start Free</a>
404          </div>
405
406          <!-- Starter -->
407          <div class="pricing-card reveal delay-1" style="padding:1.75rem;">
408            <h3>Starter</h3>
409            <div class="pricing-price">$20</div>
410            <div class="pricing-period">per month</div>
411            <ul class="pricing-features">
412              <li>25 credits/day</li>
413              <li>All 5 AI providers</li>
414              <li>Custom domains</li>
415              <li>Code export</li>
416              <li>Private projects</li>
417            </ul>
418            <a href="/app" class="btn-outline-landing pricing-btn-full">Start 7-day free trial</a>
419          </div>
420
421          <!-- Pro -->
422          <div class="pricing-card featured reveal delay-2" style="padding:1.75rem;">
423            <div class="pricing-badge">Most Popular</div>
424            <h3>Pro</h3>
425            <div class="pricing-price">$25</div>
426            <div class="pricing-period">per month</div>
427            <ul class="pricing-features">
428              <li>50 credits/day</li>
429              <li>Everything in Starter</li>
430              <li>Priority builds</li>
431              <li>Priority support</li>
432            </ul>
433            <a href="/app" class="btn-primary-landing pricing-btn-full">Start 7-day free trial</a>
434          </div>
435
436          <!-- Teams -->
437          <div class="pricing-card reveal delay-3" style="padding:1.75rem;">
438            <h3>Teams</h3>
439            <div class="pricing-price">$30</div>
440            <div class="pricing-period">per seat / month</div>
441            <ul class="pricing-features">
442              <li>100 credits/day</li>
443              <li>Everything in Pro</li>
444              <li>Workspace team invites</li>
445              <li>Shared projects</li>
446            </ul>
447            <a href="/app" class="btn-outline-landing pricing-btn-full">Start 7-day free trial</a>
448          </div>
449        </div>
450
451        <!-- Credit top-ups -->
452        <div class="hosting-box reveal delay-2" style="margin-top:2.5rem;">
453          <h4 class="hosting-title">Need more credits? <span class="hosting-badge">one-time top-ups</span></h4>
454          <p class="hosting-desc">Credit packs never expire. 1 credit = 1 AI message.</p>
455          <div class="hosting-options">
456            <div><strong class="hosting-price">$5</strong><br><span class="hosting-detail">50 credits &middot; $0.10 each</span></div>
457            <div class="hosting-divider"></div>
458            <div><strong class="hosting-price">$20</strong><br><span class="hosting-detail">250 credits &middot; $0.08 each</span></div>
459            <div class="hosting-divider"></div>
460            <div><strong class="hosting-price">$75</strong><br><span class="hosting-detail">1,000 credits &middot; $0.075 each</span></div>
461          </div>
462        </div>
463
464        <!-- Hosting: optional -->
465        <div class="hosting-box reveal delay-2">
466          <h4 class="hosting-title">Cloud Hosting <span class="hosting-badge">optional</span></h4>
467          <p class="hosting-desc">Your code is yours. Download the ZIP and deploy anywhere: Vercel, Netlify, your own server. Or let us host it:</p>
468          <div class="hosting-options">
469            <div><strong class="hosting-price">Free</strong><br><span class="hosting-detail">.vibeasite.com subdomain</span></div>
470            <div class="hosting-divider"></div>
471            <div><strong class="hosting-price">$5/mo</strong><br><span class="hosting-detail">Custom domain + SSL</span></div>
472          </div>
473        </div>
474
475        <!-- Competitive pricing comparison -->
476        <div class="pricing-comparison">
477          <h3 class="section-title reveal pricing-compare-title">How we compare on cost</h3>
478          <div class="comparison-wrapper reveal delay-1">
479            <table class="comparison-table">
480              <thead>
481                <tr>
482                  <th></th>
483                  <th class="highlight">tyga.ai</th>
484                  <th>Lovable</th>
485                  <th>Bolt</th>
486                </tr>
487              </thead>
488              <tbody>
489                <tr>
490                  <td>
490Monthly subscription</td>
491                  <td class="highlight"><strong>From $20/mo</strong> (7-day free trial)</td>
492                  <td>$25/mo minimum (Pro)</td>
493                  <td>$25/mo minimum</td>
494                </tr>
495                <tr>
496                  <td>Free credits</td>
497                  <td class="highlight">5/day (150/mo)</td>
498                  <td>5/day (30/mo cap)</td>
499                  <td>1M tokens/mo</td>
500                </tr>
501                <tr>
502                  <td>Cost per credit</td>
503                  <td class="highlight"><strong>$0.10</strong> (one-time, never expires)</td>
504                  <td>$0.25/credit (Pro) or $0.30/top-up</td>
505                  <td>Token-based (~$0.25 equiv)</td>
506                </tr>
507                <tr>
508                  <td>100 credits cost</td>
509                  <td class="highlight"><strong>$10</strong> (one-time credit pack)</td>
510                  <td>$25/mo subscription required</td>
511                  <td>~$25/mo subscription</td>
512                </tr>
513                <tr>
514                  <td>1,000 credits cost</td>
515                  <td class="highlight"><strong>$75</strong> (one-time)</td>
516                  <td>$200/mo subscription</td>
517                  <td>N/A</td>
518                </tr>
519                <tr>
520                  <td>Credit expiry</td>
521                  <td class="highlight"><strong>Never</strong></td>
522                  <td>Monthly reset (use or lose)</td>
523                  <td>Monthly reset</td>
524                </tr>
525                <tr>
526                  <td>Hosting</td>
527                  <td class="highlight">Free subdomain / $5/mo custom domain</td>
528                  <td>Included (cloud credits consumed)</td>
529                  <td>Included in plan</td>
530                </tr>
531                <tr>
532                  <td>Database</td>
533                  <td class="highlight"><span class="check">&#10003;</span> AnyDBInstance (built-in)</td>
534                  <td>Supabase (separate billing)</td>
535                  <td>✕</td>
536                </tr>
537                <tr>
538                  <td>Templates</td>
539                  <td class="highlight"><strong>23 categories</strong> (gold-standard)</td>
540                  <td>0 (blank canvas only)</td>
541                  <td>Limited</td>
542                </tr>
543                <tr>
544                  <td>Multi-agent pipeline</td>
545                  <td class="highlight"><span class="check">&#10003;</span> h-conductor (7 agents)</td>
546                  <td>Single agent</td>
547                  <td>Single agent</td>
548                </tr>
549                <tr>
550                  <td>CLI for agents</td>
551                  <td class="highlight"><span class="check">&#10003;</span> <code>npm i -g vibeasite</code></td>
552                  <td>✕</td>
553                  <td>✕</td>
554                </tr>
555              </tbody>
556            </table>
557          </div>
558        </div>
559      </div>
560    </section>
561
562    <!-- ==================== 7. TEMPLATES ==================== -->
563    <section id="templates" style="background:var(--bg-secondary);">
564      <div class="container">
565        <div style="text-align:center;">
566          <p class="section-label reveal">23 Domain Templates</p>
567          <h2 class="section-title reveal delay-1">A template for every industry</h2>
568          <p class="section-subtitle reveal delay-2" style="max-width:600px;margin:0 auto 2rem;">Each template includes tailored sections, real content, and pre-configured database schemas. Click any card to start building.</p>
569        </div>
570
571        <!-- Filter pills -->
572        <div style="display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:2rem;" class="reveal delay-2">
573          <button class="tmpl-filter tmpl-filter-active" data-filter="all" style="padding:5px 14px;border-radius:20px;font-size:0.75rem;font-weight:600;border:1px solid var(--border);background:var(--accent);color:var(--bg-primary);cursor:pointer;">All (23)</button>
574          <button class="tmpl-filter" data-filter="db" style="padding:5px 14px;border-radius:20px;font-size:0.75rem;font-weight:500;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;">With Database (10)</button>
575          <button class="tmpl-filter" data-filter="business" style="padding:5px 14px;border-radius:20px;font-size:0.75rem;font-weight:500;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;">Business</button>
576          <button class="tmpl-filter" data-filter="creative" style="padding:5px 14px;border-radius:20px;font-size:0.75rem;font-weight:500;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;">Creative</button>
577          <button class="tmpl-filter" data-filter="tools" style="padding:5px 14px;border-radius:20px;font-size:0.75rem;font-weight:500;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;">Tools</button>
578        </div>
579
580        <!-- Template grid -->
581        <div id="templateGrid" style="display:grid;grid-template-columns:repeat(auto-fill, minmax(220px, 1fr));gap:1rem;max-width:1100px;margin:0 auto;" class="reveal delay-3"></div>
582        <p class="reveal delay-4" style="margin-top:1.5rem;font-size:0.85rem;color:var(--text-muted);text-align:center;">Available in React + Tailwind and Bootstrap 5. <code style="font-size:0.75rem;">npm i -g vibeasite && vbs templates</code></p>
583      </div>
584    </section>
585    
585<script>
586    (function(){
587      const templates = [
588        { cat:'saas', name:'SaaS', desc:'Pricing, features, dashboard', icon:'&#9889;', color:'#6366f1', tags:'business db' },
589        { cat:'ecommerce', name:'E-Commerce', desc:'Product grid, cart, checkout', icon:'&#128722;', color:'#ec4899', tags:'business db' },
590        { cat:'landing', name:'Landing Page', desc:'Hero, features, CTA', icon:'&#128640;', color:'#8b5cf6', tags:'business' },
591        { cat:'portfolio', name:'Portfolio', desc:'Gallery, about, contact', icon:'&#127912;', color:'#06b6d4', tags:'creative' },
592        { cat:'blog', name:'Blog', desc:'Articles, categories, authors', icon:'&#9997;', color:'#f59e0b', tags:'creative db' },
593        { cat:'restaurant', name:'Restaurant', desc:'Menu, reservations, gallery', icon:'&#127869;', color:'#ef4444', tags:'business db' },
594        { cat:'dashboard', name:'Dashboard', desc:'KPI cards, charts, tables', icon:'&#128202;', color:'#3b82f6', tags:'tools db' },
595        { cat:'event', name:'Event', desc:'Speakers, schedule, RSVP', icon:'&#127915;', color:'#a855f7', tags:'business db' },
596        { cat:'services', name:'Services', desc:'Team, process, testimonials', icon:'&#128188;', color:'#14b8a6', tags:'business' },
597        { cat:'resume', name:'Resume', desc:'Timeline, skills, projects', icon:'&#128100;', color:'#64748b', tags:'creative' },
598        { cat:'healthcare', name:'Healthcare', desc:'Doctors, appointments, insurance', icon:'&#9764;', color:'#10b981', tags:'business db' },
599        { cat:'education', name:'Education', desc:'Courses, instructors, enroll', icon:'&#127891;', color:'#f97316', tags:'business db' },
600        { cat:'fitness', name:'Fitness', desc:'Classes, trainers, membership', icon:'&#127947;', color:'#ef4444', tags:'business db' },
601        { cat:'music', name:'Music', desc:'Discography, tours, merch', icon:'&#127925;', color:'#8b5cf6', tags:'creative' },
602        { cat:'photography', name:'Photography', desc:'Gallery, lightbox, booking', icon:'&#128247;', color:'#06b6d4', tags:'creative' },
603        { cat:'nonprofit', name:'Nonprofit', desc:'Mission, donate, volunteers', icon:'&#128154;', color:'#22c55e', tags:'business' },
604        { cat:'travel', name:'Travel', desc:'Destinations, packages, reviews', icon:'&#9992;', color:'#0ea5e9', tags:'business db' },
605        { cat:'wedding', name:'Wedding', desc:'RSVP, registry, timeline', icon:'&#128141;', color:'#ec4899', tags:'creative' },
606        { cat:'real-estate', name:'Real Estate', desc:'Listings, search, agents', icon:'&#127968;', color:'#f59e0b', tags:'business db' },
607        { cat:'editorial', name:'Editorial', desc:'Magazine, featured stories', icon:'&#128240;', color:'#64748b', tags:'creative' },
608        { cat:'developer-tools', name:'Dev Tools', desc:'API docs, playground, code', icon:'&#128187;', color:'#22d3ee', tags:'tools' },
609        { cat:'product-management', name:'Product Mgmt', desc:'Roadmap, kanban, analytics', icon:'&#128203;', color:'#a855f7', tags:'tools' },
610        { cat:'project-management', name:'Project Mgmt', desc:'Timeline, tasks, milestones', icon:'&#128197;', color:'#3b82f6', tags:'tools' },
611      ];
612      const grid = document.getElementById('templateGrid');
613      function render(filter) {
614        grid.innerHTML = templates
615          .filter(t => filter === 'all' || t.tags.includes(filter))
616          .map(t => `
617            <a href="/app?category=${t.cat}" style="text-decoration:none;display:block;background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:transform 0.2s,box-shadow 0.2s;cursor:pointer;" onmouseenter="this.style.transform='translateY(-4px)';this.style.boxShadow='0 8px 24px rgba(0,0,0,0.12)'" onmouseleave="this.style.transform='';this.style.boxShadow=''">
618              <div style="height:100px;background:linear-gradient(135deg, ${t.color}22, ${t.color}44);display:flex;align-items:center;justify-content:center;font-size:2.5rem;">${t.icon}</div>
619              <div style="padding:1rem;">
620                <div style="font-weight:700;font-size:0.9rem;color:var(--text-primary);margin-bottom:4px;">${t.name}</div>
621                <div style="font-size:0.75rem;color:var(--text-muted);line-height:1.4;">${t.desc}</div>
622                ${t.tags.includes('db') ? '<div style="margin-top:6px;"><span style="font-size:0.6rem;padding:2px 6px;border-radius:4px;background:rgba(16,185,129,0.1);color:#10b981;font-weight:600;">+ Database</span></div>' : ''}
623              </div>
624            </a>
625          `).join('');
626      }
627      render('all');
628      document.querySelectorAll('.tmpl-filter').forEach(btn => {
629        btn.addEventListener('click', () => {
630          document.querySelectorAll('.tmpl-filter').forEach(b => { b.style.background='var(--bg-tertiary)'; b.style.color='var(--text-secondary)'; b.classList.remove('tmpl-filter-active'); });
631          btn.style.background='var(--accent)'; btn.style.color='var(--bg-primary)'; btn.classList.add('tmpl-filter-active');
632          render(btn.dataset.filter);
633        });
634      });
635    })();
636    </script>
636
637
638    <!-- ==================== 8. HOW IT WORKS ==================== -->
639    <section id="how-it-works" style="background:var(--bg-secondary);">
640      <div class="container">
641        <div style="text-align:center;">
642          <p class="section-label reveal">How It Works</p>
643          <h2 class="section-title reveal delay-1" style="margin:0 auto;">Three steps to a full-stack app</h2>
644        </div>
645        <div class="steps-grid">
646          <div class="step reveal delay-1">
647            <div class="step-number">1</div>
648            <h3>Describe</h3>
649            <p>Tell tyga.ai what you want. A restaurant with reservations, a SaaS with dashboards, a portfolio with a blog.</p>
650          </div>
651          <div class="step reveal delay-2">
652            <div class="step-number">2</div>
653            <h3>AI Builds</h3>
654            <p>Our multi-agent system selects from 23 templates, generates content, provisions your database, and assembles everything, using just ~700 tokens.</p>
655          </div>
656          <div class="step reveal delay-3">
657            <div class="step-number">3</div>
658            <h3>Deploy</h3>
659            <p>Preview instantly. Your database is live. Publish with one click. Connect a custom domain. Download your code.</p>
660          </div>
661        </div>
662      </div>
663    </section>
664
665    <!-- ==================== 9. FINAL CTA ==================== -->
666    <section class="final-cta">
667      <div class="container">
668        <h2 class="reveal">Stop prototyping.<br>Start shipping full-stack.</h2>
669        <p class="reveal delay-1">Build your first app with a real database in under a minute. Free plan included.</p>
670        <a href="/app" class="btn-primary-landing btn-lg reveal delay-2">Start Building with AnyDBInstance</a>
671      </div>
672    </section>
673
674  </main>
675
676  <!-- ==================== 10. FOOTER ==================== -->
677  <footer class="landing-footer">
678    <div class="container">
679      <div class="footer-grid">
680        <div>
681          <div class="footer-brand">
682            <img src="https://prodmedia.tyga.host/public/tyga.cloud/landing/tyga.ai/tygaai-black-words.svg" alt="tyga.ai" height="28">
683          </div>
684          <p class="footer-tagline">AI-powered app builder with native AnyDBInstance integration. Build full-stack in minutes, not months.</p>
685        </div>
686        <div class="footer-col">
687          <h4>Product</h4>
688          <a href="#features">Features</a>
689          <a href="#database">Database</a>
690          <a href="#pricing">Pricing</a>
691          <a href="#templates">Templates</a>
692        </div>
693        <div class="footer-col">
694          <h4>Resources</h4>
695          <a href="/docs">Documentation</a>
696          <a href="/community">Community</a>
697        </div>
698        <div class="footer-col">
699          <h4>Legal</h4>
700          <a href="/privacy">Privacy</a>
701          <a href="/terms">Terms</a>
702          <a href="/cookies">Cookies</a>
703        </div>
704      </div>
705      <div class="footer-bottom">
706        <span>&copy; 2026 Tyga.Cloud Ltd. All rights reserved.</span>
707        <div>
708          <a href="/privacy" style="margin-right:1rem;">Privacy</a>
709          <a href="/terms" style="margin-right:1rem;">Terms</a>
710          <a href="/cookies">Cookies</a>
711        </div>
712      </div>
713    </div>
714  </footer>
715
716  <!-- ==================== INLINE JS ==================== -->
717  
717<script>
718    // Theme toggle
719    (function() {
720      var toggle = document.getElementById('themeToggle');
721      var stored = localStorage.getItem('landing-theme');
722      if (stored) {
723        document.body.setAttribute('data-theme', stored);
724        toggle.innerHTML = stored === 'dark' ? '&#9788;' : '&#9790;';
725      }
726      toggle.addEventListener('click', function() {
727        var current = document.body.getAttribute('data-theme');
728        var next = current === 'dark' ? 'light' : 'dark';
729        document.body.setAttribute('data-theme', next);
730        localStorage.setItem('landing-theme', next);
731        toggle.innerHTML = next === 'dark' ? '&#9788;' : '&#9790;';
732      });
733    })();
734
735    // Nav scroll effect
736    (function() {
737      var nav = document.getElementById('nav');
738      window.addEventListener('scroll', function() {
739        nav.classList.toggle('scrolled', window.scrollY > 20);
740      }, { passive: true });
741    })();
742
743    // Hamburger menu
744    (function() {
745      var btn = document.getElementById('hamburger');
746      var links = document.getElementById('navLinks');
747      btn.addEventListener('click', function() {
748        links.classList.toggle('menu-open');
749      });
750      links.querySelectorAll('a').forEach(function(a) {
751        a.addEventListener('click', function() {
752          links.classList.remove('menu-open');
753        });
754      });
755    })();
756
757    // Smooth scroll for anchor links
758    document.querySelectorAll('a[href^="#"]').forEach(function(a) {
759      a.addEventListener('click', function(e) {
760        var target = document.querySelector(this.getAttribute('href'));
761        if (target) {
762          e.preventDefault();
763          target.scrollIntoView({ behavior: 'smooth', block: 'start' });
764        }
765      });
766    });
767
768    // Counter animation for proof numbers
769    (function() {
770      var counters = document.querySelectorAll('.proof-number[data-target]');
771      var animated = new Set();
772
773      function animateCounter(el) {
774        var target = parseInt(el.getAttribute('data-target'), 10);
775        var duration = 1500;
776        var startTime = null;
777        var prefix = el.getAttribute('data-prefix') || '';
778
779        function step(timestamp) {
780          if (!startTime) startTime = timestamp;
781          var progress = Math.min((timestamp - startTime) / duration, 1);
782          var eased = 1 - Math.pow(1 - progress, 3);
783          var current = Math.floor(eased * target);
784          el.textContent = prefix + current;
785          if (progress < 1) {
786            requestAnimationFrame(step);
787          } else {
788            el.textContent = prefix + target;
789          }
790        }
791        requestAnimationFrame(step);
792      }
793
794      var observer = new IntersectionObserver(function(entries) {
795        entries.forEach(function(entry) {
796          if (entry.isIntersecting && !animated.has(entry.target)) {
797            animated.add(entry.target);
798            animateCounter(entry.target);
799          }
800        });
801      }, { threshold: 0.5 });
802
803      counters.forEach(function(c) { observer.observe(c); });
804    })();
805
806    // Reveal on scroll
807    (function() {
808      var reveals = document.querySelectorAll('.reveal');
809      var observer = new IntersectionObserver(function(entries) {
810        entries.forEach(function(entry) {
811          if (entry.isIntersecting) {
812            entry.target.classList.add('visible');
813          }
814        });
815      }, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });
816
817      reveals.forEach(function(el) { observer.observe(el); });
818    })();
819  </script>
819
820  
820<script src="/js/cookie-consent.js" defer></script>
820
821
822  <!-- Tai Chat Widget: h-conductor powered sales + support -->
823  <link rel="stylesheet" href="/css/tai-widget.css">
824  <div class="tai-backdrop"></div>
825  <div class="tai-panel" role="dialog" aria-label="Chat with Tai">
826    <div class="tai-header">
827      <span class="tai-dot"></span>
828      Tai: AI Website Builder
829      <button class="tai-maximize" aria-label="Expand chat" title="Expand">
830        <svg viewBox="0 0 24 24"><path d="M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z"/></svg>
831      </button>
832    </div>
833    <div class="tai-messages" role="log">
834      <div class="tai-msg assistant">Hi! I'm <strong>Tai</strong>, your AI website builder. I can create production-ready websites in seconds across 23 categories: SaaS, ecommerce, portfolio, restaurant, and more. What kind of site do you need?</div>
835    </div>
836    <div class="tai-typing"><span></span><span></span><span></span></div>
837    <div class="tai-input-area">
838      <textarea class="tai-input" placeholder="Ask Tai anything..." rows="1" maxlength="2000"></textarea>
839      <button class="tai-send" aria-label="Send"><svg viewBox="0 0 24 24"><path d="M2.01 21L23 12 2.01 3 2 10l15 2-15 2z"/></svg></button>
840    </div>
841  </div>
842  <button class="tai-bubble" aria-label="Chat with Tai">
843    <svg class="tai-chat-icon" viewBox="0 0 24 24"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H5.17L4 17.17V4h16v12z"/><path d="M7 9h10v2H7zm0-3h10v2H7z"/></svg>
844    <svg class="tai-close" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>
845  </button>
846  
846<script src="/js/tai-widget.js" defer></script>
846
847</body>
848</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.