thumbgate 1.4.4 → 1.4.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.claude-plugin/marketplace.json +2 -2
- package/.claude-plugin/plugin.json +1 -1
- package/.well-known/llms.txt +12 -8
- package/.well-known/mcp/server-card.json +1 -1
- package/README.md +20 -10
- package/adapters/README.md +1 -1
- package/adapters/claude/.mcp.json +2 -2
- package/adapters/codex/config.toml +2 -2
- package/adapters/mcp/server-stdio.js +1 -1
- package/adapters/opencode/opencode.json +1 -1
- package/config/github-about.json +2 -2
- package/package.json +7 -3
- package/public/compare.html +310 -0
- package/public/guide.html +317 -0
- package/public/index.html +1302 -0
- package/public/lessons.html +989 -0
- package/scripts/billing.js +5 -2
- package/scripts/telemetry-analytics.js +41 -1
- package/src/api/server.js +282 -0
|
@@ -0,0 +1,1302 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<!--
|
|
5
|
+
______ __
|
|
6
|
+
/ ____/___ ____ ___ ____ __ __/ /____ _____
|
|
7
|
+
/ / / __ \/ __ `__ \/ __ \/ / / / __/ _ \/ ___/
|
|
8
|
+
/ /___/ /_/ / / / / / / /_/ / /_/ / /_/ __/ /
|
|
9
|
+
\____/\____/_/ /_/ /_/ .___/\__,_/\__/\___/_/
|
|
10
|
+
/_/
|
|
11
|
+
Created with Perplexity Computer
|
|
12
|
+
https://www.perplexity.ai/computer
|
|
13
|
+
-->
|
|
14
|
+
<meta name="generator" content="ThumbGate">
|
|
15
|
+
<meta name="author" content="Igor Ganapolsky">
|
|
16
|
+
<meta property="og:see_also" content="https://www.perplexity.ai/computer">
|
|
17
|
+
<link rel="author" href="https://www.perplexity.ai/computer">
|
|
18
|
+
|
|
19
|
+
<meta charset="UTF-8">
|
|
20
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
21
|
+
__GOOGLE_SITE_VERIFICATION_META__
|
|
22
|
+
<title>ThumbGate — Stop AI agents before they make costly mistakes</title>
|
|
23
|
+
<meta name="description" content="Stop expensive AI agent mistakes before they happen. 👎 Thumbs down becomes history-aware lessons and Pre-Action Gates; 👍 thumbs up reinforces safe patterns. ThumbGate checks risky commands, deploys, API calls, and file edits across ChatGPT, Claude Code, Cursor, Codex, Gemini, Amp, and OpenCode with workflow governance, shared lessons and org visibility for safer vibe coding.">
|
|
24
|
+
<meta property="og:title" content="ThumbGate — Stop AI agents before they make costly mistakes">
|
|
25
|
+
<meta property="og:description" content="Stop expensive AI agent mistakes before they happen. 👎 Thumbs down becomes history-aware lessons and Pre-Action Gates; 👍 thumbs up reinforces safe patterns. ThumbGate checks risky commands, deploys, API calls, and file edits across ChatGPT, Claude Code, Cursor, Codex, Gemini, Amp, and OpenCode with workflow governance, shared lessons and org visibility for safer vibe coding.">
|
|
26
|
+
<meta property="og:type" content="website">
|
|
27
|
+
<meta name="keywords" content="ThumbGate, thumbgate, agent governance, AI coding workflow governance, workflow hardening sprint, pre-action gates, CLI-first agent safety, Claude Code, Cursor, Codex, Gemini, Amp, OpenCode, approval policies, audit trail, release confidence, Docker Sandboxes, feedback enforcement, context engineering, AI authenticity, prevent AI slop, human-led AI, AI agent standards enforcement, brand authenticity AI">
|
|
28
|
+
|
|
29
|
+
<!-- Privacy-friendly analytics by Plausible -->
|
|
30
|
+
<script defer data-domain="thumbgate-production.up.railway.app" src="https://plausible.io/js/script.js"></script>
|
|
31
|
+
__GA_BOOTSTRAP__
|
|
32
|
+
|
|
33
|
+
<script>
|
|
34
|
+
const gaMeasurementId = '__GA_MEASUREMENT_ID__';
|
|
35
|
+
const serverVisitorId = '__SERVER_VISITOR_ID__';
|
|
36
|
+
const serverSessionId = '__SERVER_SESSION_ID__';
|
|
37
|
+
const serverAcquisitionId = '__SERVER_ACQUISITION_ID__';
|
|
38
|
+
const serverTelemetryCaptured = '__SERVER_TELEMETRY_CAPTURED__' === 'true';
|
|
39
|
+
</script>
|
|
40
|
+
|
|
41
|
+
<script type="application/ld+json">
|
|
42
|
+
{
|
|
43
|
+
"@context": "https://schema.org",
|
|
44
|
+
"@type": "SoftwareApplication",
|
|
45
|
+
"name": "ThumbGate",
|
|
46
|
+
"alternateName": "thumbgate",
|
|
47
|
+
"description": "ThumbGate stops costly AI agent mistakes before they happen. It checks risky commands, file edits, deploys, API calls, and other agent actions before execution, then turns thumbs-up/down feedback into Pre-Action Gates, workflow governance, shared lessons, org visibility, release confidence, and isolated execution guidance.",
|
|
48
|
+
"applicationCategory": "DeveloperApplication",
|
|
49
|
+
"operatingSystem": "Cross-platform, Node.js >=18.18.0",
|
|
50
|
+
"license": "https://opensource.org/licenses/MIT",
|
|
51
|
+
"url": "https://github.com/IgorGanapolsky/ThumbGate",
|
|
52
|
+
"downloadUrl": "https://www.npmjs.com/package/thumbgate",
|
|
53
|
+
"installUrl": "https://www.npmjs.com/package/thumbgate",
|
|
54
|
+
"dateModified": "2026-04-09",
|
|
55
|
+
"creator": {
|
|
56
|
+
"@type": "Person",
|
|
57
|
+
"name": "Igor Ganapolsky",
|
|
58
|
+
"url": "https://github.com/IgorGanapolsky"
|
|
59
|
+
},
|
|
60
|
+
"featureList": [
|
|
61
|
+
"Prevent expensive AI mistakes — catch bad commands, destructive database actions, unsafe publishes, and risky API calls before execution",
|
|
62
|
+
"Make AI stop repeating mistakes — thumbs-down feedback becomes history-aware lessons and Pre-Action Gates",
|
|
63
|
+
"Turn AI into a reliable operator — checkpoint risky actions, enforce safe patterns, and keep proof of what changed",
|
|
64
|
+
"ThumbGate GPT for ChatGPT — check proposed agent actions, capture thumbs-up/down lessons, and route users into local enforcement",
|
|
65
|
+
"Workflow Sentinel — score blast radius before PR, merge, release, and publish actions fire",
|
|
66
|
+
"Docker Sandboxes routing — move high-risk local runs into isolated microVM-backed execution",
|
|
67
|
+
"Hosted sandbox dispatch — signed isolated lane for team automations",
|
|
68
|
+
"Domain Skill Packs — Stripe, Railway, database migration best practices",
|
|
69
|
+
"Progressive Disclosure — 82% token savings with 3-tier L1/L2/L3 loading",
|
|
70
|
+
"Hallucination Detection — decomposes claims into verifiable sub-claims",
|
|
71
|
+
"PII Scanner — blocks emails, credit cards, SSNs in feedback and exports",
|
|
72
|
+
"Background Agent Governance — per-agent pass rates, CI auto-feedback",
|
|
73
|
+
"Memory Migration — imports Claude Code MEMORY.md into unlimited SQLite DB",
|
|
74
|
+
"Prompt-Level DLP — scans tool call inputs before execution",
|
|
75
|
+
"Per-Step Scoring — every gate decision becomes a DPO/KTO training signal",
|
|
76
|
+
"HuggingFace Export — share PII-redacted agent traces as open training datasets",
|
|
77
|
+
"Unified Context — one-call context assembly with session, lessons, guards, and code-graph",
|
|
78
|
+
"AI Authenticity Enforcement — every gate reflects your team's actual standards, not generic AI patterns"
|
|
79
|
+
],
|
|
80
|
+
"offers": [
|
|
81
|
+
{
|
|
82
|
+
"@type": "Offer",
|
|
83
|
+
"name": "Free",
|
|
84
|
+
"price": "0",
|
|
85
|
+
"priceCurrency": "USD",
|
|
86
|
+
"description": "Free local CLI enforcement for one developer — captures, recalls, gates, and PreToolUse hook blocking after install"
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
"@type": "Offer",
|
|
90
|
+
"name": "Team",
|
|
91
|
+
"price": "99",
|
|
92
|
+
"priceCurrency": "USD",
|
|
93
|
+
"description": "Intake-led team rollout with a workflow hardening sprint, shared enforcement memory, org dashboard visibility, approval boundaries, release confidence, Docker Sandboxes guidance for risky local autonomy, and pilot support for teams shipping AI-generated changes",
|
|
94
|
+
"url": "https://thumbgate-production.up.railway.app/#workflow-sprint-intake"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
"@type": "Offer",
|
|
98
|
+
"name": "Pro Monthly",
|
|
99
|
+
"price": "19",
|
|
100
|
+
"priceCurrency": "USD",
|
|
101
|
+
"description": "Self-serve side lane for solo operators who want personal enforcement proof, a local dashboard, DPO export, and proof-ready exports",
|
|
102
|
+
"url": "https://thumbgate-production.up.railway.app/checkout/pro?plan_id=pro&landing_path=%2F"
|
|
103
|
+
},
|
|
104
|
+
{
|
|
105
|
+
"@type": "Offer",
|
|
106
|
+
"name": "Pro Annual",
|
|
107
|
+
"price": "149",
|
|
108
|
+
"priceCurrency": "USD",
|
|
109
|
+
"description": "Annual Pro for individual operators who want personal enforcement proof, the local dashboard, and proof-ready exports",
|
|
110
|
+
"url": "https://thumbgate-production.up.railway.app/checkout/pro?plan_id=pro&billing_cycle=annual&landing_path=%2F"
|
|
111
|
+
}
|
|
112
|
+
]
|
|
113
|
+
}
|
|
114
|
+
</script>
|
|
115
|
+
|
|
116
|
+
<script type="application/ld+json">
|
|
117
|
+
{
|
|
118
|
+
"@context": "https://schema.org",
|
|
119
|
+
"@type": "HowTo",
|
|
120
|
+
"name": "How to make your AI coding agent self-improving",
|
|
121
|
+
"description": "Set up ThumbGate so your AI agent learns from every mistake and never repeats it — a self-improvement loop powered by feedback enforcement and a trained local intervention policy.",
|
|
122
|
+
"step": [
|
|
123
|
+
{
|
|
124
|
+
"@type": "HowToStep",
|
|
125
|
+
"position": 1,
|
|
126
|
+
"name": "Install ThumbGate",
|
|
127
|
+
"text": "Run: npx thumbgate init --agent claude-code. This installs the local CLI gateway and wires the agent's MCP transport automatically. No API key needed and the core path stays local."
|
|
128
|
+
},
|
|
129
|
+
{
|
|
130
|
+
"@type": "HowToStep",
|
|
131
|
+
"position": 2,
|
|
132
|
+
"name": "Give feedback when something goes wrong",
|
|
133
|
+
"text": "When your agent makes a mistake, give it a thumbs down with context. In the current Claude auto-capture hook, vague negative signals can reuse up to 8 prior recorded entries before promotion and stay linked to a 60-second feedback session for later clarification."
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
"@type": "HowToStep",
|
|
137
|
+
"position": 3,
|
|
138
|
+
"name": "Prevention rules auto-generate",
|
|
139
|
+
"text": "After repeated failures in the same domain, ThumbGate auto-generates prevention rules. These rules are injected into the agent's context at the start of every session via the recall MCP tool."
|
|
140
|
+
},
|
|
141
|
+
{
|
|
142
|
+
"@type": "HowToStep",
|
|
143
|
+
"position": 4,
|
|
144
|
+
"name": "Pre-action gates block the mistake",
|
|
145
|
+
"text": "When the agent tries to repeat a known-bad action, the PreToolUse hook fires and physically blocks the tool call before execution. The agent cannot repeat the mistake."
|
|
146
|
+
}
|
|
147
|
+
],
|
|
148
|
+
"totalTime": "PT5M",
|
|
149
|
+
"tool": { "@type": "SoftwareApplication", "name": "thumbgate", "url": "https://www.npmjs.com/package/thumbgate" }
|
|
150
|
+
}
|
|
151
|
+
</script>
|
|
152
|
+
|
|
153
|
+
<script type="application/ld+json">
|
|
154
|
+
{
|
|
155
|
+
"@context": "https://schema.org",
|
|
156
|
+
"@type": "FAQPage",
|
|
157
|
+
"mainEntity": [
|
|
158
|
+
{
|
|
159
|
+
"@type": "Question",
|
|
160
|
+
"name": "Does ThumbGate support model fine-tuning?",
|
|
161
|
+
"acceptedAnswer": {
|
|
162
|
+
"@type": "Answer",
|
|
163
|
+
"text": "Yes. ThumbGate Pro includes a Model Hardening Advisor and LoRA JSONL export. Pro users can export their episodic memory as DPO (Direct Preference Optimization) pairs to fine-tune local models (like Llama 3 or Mistral) so they natively avoid repeating known mistakes."
|
|
164
|
+
}
|
|
165
|
+
},
|
|
166
|
+
{
|
|
167
|
+
"@type": "Question",
|
|
168
|
+
"name": "How is ThumbGate different from model-training feedback loops?",
|
|
169
|
+
"acceptedAnswer": {
|
|
170
|
+
"@type": "Answer",
|
|
171
|
+
"text": "Model-training feedback loops update weights. ThumbGate does not touch the model. It injects past feedback into context so your agent is shaped by your corrections in real time. Think of it as a behavioral immune system, not a training pipeline. The gate blocks are hard enforcement, not soft suggestions."
|
|
172
|
+
}
|
|
173
|
+
},
|
|
174
|
+
{
|
|
175
|
+
"@type": "Question",
|
|
176
|
+
"name": "What is the ThumbGate tech stack?",
|
|
177
|
+
"acceptedAnswer": {
|
|
178
|
+
"@type": "Answer",
|
|
179
|
+
"text": "SQLite+FTS5 lesson DB, MemAlign-inspired dual recall, Thompson Sampling for adaptive gates, LanceDB vector search with Hugging Face embeddings, ContextFS context assembly, Bayesian belief updates, and PreToolUse hook enforcement."
|
|
180
|
+
}
|
|
181
|
+
},
|
|
182
|
+
{
|
|
183
|
+
"@type": "Question",
|
|
184
|
+
"name": "What AI agents does ThumbGate work with?",
|
|
185
|
+
"acceptedAnswer": {
|
|
186
|
+
"@type": "Answer",
|
|
187
|
+
"text": "Claude Code, Cursor, Codex, Gemini CLI, Amp, OpenCode, and any MCP-compatible agent."
|
|
188
|
+
}
|
|
189
|
+
},
|
|
190
|
+
{
|
|
191
|
+
"@type": "Question",
|
|
192
|
+
"name": "Do I have to chat inside the ThumbGate GPT for enforcement?",
|
|
193
|
+
"acceptedAnswer": {
|
|
194
|
+
"@type": "Answer",
|
|
195
|
+
"text": "No. The ThumbGate GPT is the ChatGPT entrypoint for checking proposed actions, capturing thumbs-up/down lessons, and getting setup help. Use it for advice and checkpointing; hard enforcement still runs locally where the agent executes after npx thumbgate init."
|
|
196
|
+
}
|
|
197
|
+
},
|
|
198
|
+
{
|
|
199
|
+
"@type": "Question",
|
|
200
|
+
"name": "How does ThumbGate reduce host blast radius for high-risk local runs?",
|
|
201
|
+
"acceptedAnswer": {
|
|
202
|
+
"@type": "Answer",
|
|
203
|
+
"text": "ThumbGate combines pre-action gates with execution guidance. Workflow Sentinel predicts risky local actions before they execute, and high-risk runs can be routed into Docker Sandboxes instead of running directly on the host. Team workflows also have a signed hosted sandbox lane for isolated automation dispatch."
|
|
204
|
+
}
|
|
205
|
+
},
|
|
206
|
+
{
|
|
207
|
+
"@type": "Question",
|
|
208
|
+
"name": "How are pre-action gates different from prompt rules?",
|
|
209
|
+
"acceptedAnswer": {
|
|
210
|
+
"@type": "Answer",
|
|
211
|
+
"text": "Prompt rules are suggestions agents can ignore. Pre-Action Gates are enforcement — they block the action before execution via PreToolUse hooks. Gates are auto-generated from feedback and use Thompson Sampling to adapt."
|
|
212
|
+
}
|
|
213
|
+
},
|
|
214
|
+
{
|
|
215
|
+
"@type": "Question",
|
|
216
|
+
"name": "How does ThumbGate prevent AI slop and protect brand authenticity?",
|
|
217
|
+
"acceptedAnswer": {
|
|
218
|
+
"@type": "Answer",
|
|
219
|
+
"text": "AI slop happens when agents act without human judgment as a hard gate — generating repetitive, generic outputs that erode trust and dilute your brand. ThumbGate inserts human thumbs-up/down between AI intent and execution. Every thumbs-down becomes a prevention rule that blocks the bad pattern permanently. Every thumbs-up reinforces what 'good' looks like for your specific context. Your agent's outputs reflect your actual standards, not generic AI patterns. This is authenticity enforcement at the tool-call level."
|
|
220
|
+
}
|
|
221
|
+
},
|
|
222
|
+
{
|
|
223
|
+
"@type": "Question",
|
|
224
|
+
"name": "How is ThumbGate different from SpecLock?",
|
|
225
|
+
"acceptedAnswer": {
|
|
226
|
+
"@type": "Answer",
|
|
227
|
+
"text": "SpecLock requires manually writing constraints or compiling them from a PRD. ThumbGate learns automatically from thumbs-up/down feedback and auto-generates prevention rules from repeated failures. SpecLock locks files from modification; ThumbGate blocks specific actions (like force-push) before they execute."
|
|
228
|
+
}
|
|
229
|
+
},
|
|
230
|
+
{
|
|
231
|
+
"@type": "Question",
|
|
232
|
+
"name": "How is ThumbGate different from Mem0?",
|
|
233
|
+
"acceptedAnswer": {
|
|
234
|
+
"@type": "Answer",
|
|
235
|
+
"text": "Mem0 is cloud-hosted memory for AI apps. ThumbGate is local-first enforcement. Mem0 remembers context but cannot block actions. ThumbGate captures feedback, promotes it to prevention rules, and physically blocks tool calls that match known failure patterns via PreToolUse hooks."
|
|
236
|
+
}
|
|
237
|
+
}
|
|
238
|
+
]
|
|
239
|
+
}
|
|
240
|
+
</script>
|
|
241
|
+
|
|
242
|
+
<style>
|
|
243
|
+
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
|
|
244
|
+
|
|
245
|
+
:root {
|
|
246
|
+
--bg: #0a0a0b;
|
|
247
|
+
--bg-raised: #111113;
|
|
248
|
+
--bg-card: #161618;
|
|
249
|
+
--border: #222225;
|
|
250
|
+
--text: #e8e8ec;
|
|
251
|
+
--text-muted: #8b8b96;
|
|
252
|
+
--cyan: #22d3ee;
|
|
253
|
+
--cyan-dim: rgba(34, 211, 238, 0.12);
|
|
254
|
+
--cyan-glow: rgba(34, 211, 238, 0.25);
|
|
255
|
+
--green: #4ade80;
|
|
256
|
+
--red: #f87171;
|
|
257
|
+
--font: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Inter', Roboto, sans-serif;
|
|
258
|
+
--mono: 'SF Mono', 'Cascadia Code', 'JetBrains Mono', 'Fira Code', Consolas, monospace;
|
|
259
|
+
}
|
|
260
|
+
|
|
261
|
+
html { scroll-behavior: smooth; }
|
|
262
|
+
body { font-family: var(--font); background: var(--bg); color: var(--text); line-height: 1.6; -webkit-font-smoothing: antialiased; }
|
|
263
|
+
|
|
264
|
+
.container { max-width: 960px; margin: 0 auto; padding: 0 24px; }
|
|
265
|
+
|
|
266
|
+
/* NAV */
|
|
267
|
+
nav { position: sticky; top: 0; z-index: 50; background: rgba(10,10,11,0.85); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border); padding: 14px 0; }
|
|
268
|
+
nav .container { display: flex; justify-content: space-between; align-items: center; }
|
|
269
|
+
.nav-logo { font-weight: 700; font-size: 15px; letter-spacing: -0.02em; color: var(--text); text-decoration: none; }
|
|
270
|
+
.nav-logo span { color: var(--cyan); }
|
|
271
|
+
.nav-links { display: flex; gap: 24px; align-items: center; }
|
|
272
|
+
.nav-links a { color: var(--text-muted); text-decoration: none; font-size: 13px; transition: color 0.15s; }
|
|
273
|
+
.nav-links a:hover { color: var(--text); }
|
|
274
|
+
.nav-cta { background: var(--cyan); color: var(--bg); padding: 6px 14px; border-radius: 6px; font-weight: 600; font-size: 13px; text-decoration: none; transition: opacity 0.15s; }
|
|
275
|
+
.nav-cta:hover { opacity: 0.85; }
|
|
276
|
+
|
|
277
|
+
/* HERO */
|
|
278
|
+
.hero { padding: 100px 0 72px; text-align: center; }
|
|
279
|
+
.hero-thumbs { font-size: 72px; margin-bottom: 20px; line-height: 1; filter: drop-shadow(0 0 24px rgba(34,211,238,0.3)); }
|
|
280
|
+
.hero-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--cyan); background: var(--cyan-dim); border: 1px solid rgba(34,211,238,0.2); padding: 4px 12px; border-radius: 100px; margin-bottom: 24px; font-weight: 500; letter-spacing: 0.02em; text-transform: uppercase; }
|
|
281
|
+
.hero h1 { font-size: clamp(32px, 5vw, 52px); font-weight: 700; letter-spacing: -0.035em; line-height: 1.1; max-width: 700px; margin: 0 auto 16px; }
|
|
282
|
+
.hero p { font-size: 17px; color: var(--text-muted); max-width: 520px; margin: 0 auto 36px; line-height: 1.6; }
|
|
283
|
+
.hero-persona { font-size: 15px; color: var(--cyan); max-width: 600px; margin: 0 auto 20px; line-height: 1.5; font-weight: 500; }
|
|
284
|
+
.hero-signals { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 0 auto 28px; max-width: 760px; }
|
|
285
|
+
.signal-pill { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--bg-raised); font-size: 13px; font-weight: 600; letter-spacing: -0.01em; }
|
|
286
|
+
.signal-pill.signal-up { border-color: rgba(74, 222, 128, 0.28); color: #b8f7c8; background: rgba(74, 222, 128, 0.08); }
|
|
287
|
+
.signal-pill.signal-down { border-color: rgba(248, 113, 113, 0.28); color: #ffc0c0; background: rgba(248, 113, 113, 0.08); }
|
|
288
|
+
.hero-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 0 auto 16px; max-width: 760px; }
|
|
289
|
+
.btn-pro-page { display: inline-flex; align-items: center; justify-content: center; padding: 11px 18px; background: var(--cyan); color: var(--bg); border-radius: 999px; text-decoration: none; font-size: 14px; font-weight: 700; box-shadow: 0 0 0 1px rgba(34,211,238,0.28), 0 12px 32px rgba(34,211,238,0.18); transition: opacity 0.15s, transform 0.15s; }
|
|
290
|
+
.btn-pro-page:hover { opacity: 0.9; transform: translateY(-1px); }
|
|
291
|
+
.btn-gpt-page { display: inline-flex; align-items: center; justify-content: center; padding: 14px 32px; background: var(--green); color: #06120a; border-radius: 8px; text-decoration: none; font-size: 16px; font-weight: 800; box-shadow: 0 0 0 1px rgba(74,222,128,0.32), 0 12px 32px rgba(74,222,128,0.18); transition: opacity 0.15s, transform 0.15s; }
|
|
292
|
+
.btn-gpt-page:hover { opacity: 0.92; transform: translateY(-1px); }
|
|
293
|
+
.hero-paid-note { font-size: 14px; color: var(--text-muted); max-width: 720px; margin: 0 auto 24px; }
|
|
294
|
+
.hero-paid-note strong { color: var(--text); }
|
|
295
|
+
.hero-install { background: var(--bg-raised); border: 1px solid var(--border); border-radius: 10px; padding: 14px 24px; display: inline-flex; align-items: center; gap: 12px; font-family: var(--mono); font-size: 15px; margin-bottom: 40px; cursor: pointer; transition: border-color 0.2s; position: relative; max-width: 100%; overflow-x: auto; }
|
|
296
|
+
.hero-install:hover { border-color: var(--cyan); }
|
|
297
|
+
.hero-install .prompt { color: var(--text-muted); user-select: none; }
|
|
298
|
+
.hero-install .cmd { color: var(--cyan); }
|
|
299
|
+
.hero-install .copy-hint { font-size: 11px; color: var(--text-muted); font-family: var(--font); margin-left: 8px; }
|
|
300
|
+
.hero-install .copied { color: var(--green); }
|
|
301
|
+
|
|
302
|
+
/* SOCIAL PROOF BAR */
|
|
303
|
+
.proof-bar { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; font-size: 13px; color: var(--text-muted); padding: 0 0 8px; }
|
|
304
|
+
.proof-bar a { display: inline-flex; align-items: center; gap: 6px; color: var(--text-muted); text-decoration: none; transition: color 0.15s; }
|
|
305
|
+
.proof-bar a:hover { color: var(--cyan); }
|
|
306
|
+
.proof-bar .dot { width: 4px; height: 4px; background: var(--border); border-radius: 50%; display: inline-block; }
|
|
307
|
+
|
|
308
|
+
/* COMPATIBILITY */
|
|
309
|
+
.compatibility { padding: 0 0 80px; }
|
|
310
|
+
.compatibility-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
|
|
311
|
+
.compat-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 24px; text-decoration: none; color: inherit; display: block; transition: border-color 0.2s, transform 0.15s; cursor: pointer; }
|
|
312
|
+
.compat-card:hover { border-color: rgba(34,211,238,0.3); transform: translateY(-2px); }
|
|
313
|
+
.compat-card h3 { font-size: 16px; font-weight: 600; letter-spacing: -0.01em; margin-bottom: 10px; }
|
|
314
|
+
.compat-card .card-arrow { font-size: 13px; color: var(--cyan); margin-top: 12px; font-weight: 500; }
|
|
315
|
+
.compat-card p { font-size: 14px; color: var(--text-muted); line-height: 1.6; }
|
|
316
|
+
.compat-card code { font-family: var(--mono); font-size: 12px; background: rgba(34,211,238,0.08); color: var(--cyan); padding: 2px 6px; border-radius: 4px; }
|
|
317
|
+
|
|
318
|
+
/* CHATGPT GPT PATH */
|
|
319
|
+
.gpt-path { padding: 0 0 80px; }
|
|
320
|
+
.gpt-panel { border: 1px solid rgba(74,222,128,0.32); background: linear-gradient(180deg, rgba(17,17,19,0.98) 0%, rgba(15,24,18,0.96) 100%); border-radius: 8px; padding: 28px; }
|
|
321
|
+
.gpt-panel h2 { font-size: clamp(24px, 3vw, 34px); line-height: 1.15; letter-spacing: -0.025em; margin-bottom: 12px; }
|
|
322
|
+
.gpt-panel > p { color: var(--text-muted); max-width: 780px; margin-bottom: 22px; }
|
|
323
|
+
.gpt-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 24px 0; }
|
|
324
|
+
.gpt-step { border: 1px solid var(--border); border-radius: 8px; background: rgba(10,10,11,0.58); padding: 18px; }
|
|
325
|
+
.gpt-step strong { display: block; color: var(--green); margin-bottom: 6px; }
|
|
326
|
+
.gpt-step p { color: var(--text-muted); font-size: 14px; line-height: 1.55; }
|
|
327
|
+
.gpt-note { font-size: 13px; color: var(--text-muted); border-top: 1px solid var(--border); padding-top: 16px; }
|
|
328
|
+
.gpt-note strong { color: var(--text); }
|
|
329
|
+
|
|
330
|
+
/* SEO PAGES */
|
|
331
|
+
.seo-pages { padding: 0 0 80px; }
|
|
332
|
+
.seo-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
|
|
333
|
+
.seo-card {
|
|
334
|
+
background: linear-gradient(180deg, rgba(17,17,19,0.98) 0%, rgba(22,22,24,0.96) 100%);
|
|
335
|
+
border: 1px solid var(--border);
|
|
336
|
+
border-radius: 14px;
|
|
337
|
+
padding: 24px;
|
|
338
|
+
text-decoration: none;
|
|
339
|
+
color: inherit;
|
|
340
|
+
transition: border-color 0.2s, transform 0.15s;
|
|
341
|
+
}
|
|
342
|
+
.seo-card:hover { border-color: rgba(34,211,238,0.3); transform: translateY(-2px); }
|
|
343
|
+
.seo-card h3 { font-size: 18px; margin-bottom: 10px; letter-spacing: -0.02em; }
|
|
344
|
+
.seo-card p { font-size: 14px; color: var(--text-muted); line-height: 1.6; }
|
|
345
|
+
.seo-kicker {
|
|
346
|
+
display: inline-flex;
|
|
347
|
+
align-items: center;
|
|
348
|
+
gap: 8px;
|
|
349
|
+
font-size: 11px;
|
|
350
|
+
text-transform: uppercase;
|
|
351
|
+
letter-spacing: 0.08em;
|
|
352
|
+
color: var(--cyan);
|
|
353
|
+
margin-bottom: 12px;
|
|
354
|
+
font-weight: 700;
|
|
355
|
+
}
|
|
356
|
+
.seo-card .card-arrow { font-size: 13px; color: var(--cyan); margin-top: 12px; font-weight: 500; }
|
|
357
|
+
|
|
358
|
+
/* HOW IT WORKS */
|
|
359
|
+
.how-it-works { padding: 80px 0; }
|
|
360
|
+
.section-label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--cyan); font-weight: 600; margin-bottom: 12px; text-align: center; }
|
|
361
|
+
.section-title { font-size: clamp(24px, 3vw, 32px); font-weight: 700; letter-spacing: -0.025em; text-align: center; margin-bottom: 48px; }
|
|
362
|
+
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
|
|
363
|
+
.step { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 28px 24px; position: relative; transition: border-color 0.2s; }
|
|
364
|
+
.step:hover { border-color: rgba(34,211,238,0.3); }
|
|
365
|
+
.step-num { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 8px; background: var(--cyan-dim); color: var(--cyan); font-size: 13px; font-weight: 700; margin-bottom: 16px; }
|
|
366
|
+
.step h3 { font-size: 16px; font-weight: 600; margin-bottom: 8px; letter-spacing: -0.01em; }
|
|
367
|
+
.step p { font-size: 14px; color: var(--text-muted); line-height: 1.55; }
|
|
368
|
+
.step code { font-family: var(--mono); font-size: 12px; background: rgba(34,211,238,0.08); color: var(--cyan); padding: 2px 6px; border-radius: 4px; }
|
|
369
|
+
|
|
370
|
+
/* CODE EXAMPLE */
|
|
371
|
+
.code-section { padding: 0 0 80px; }
|
|
372
|
+
.code-block { background: var(--bg-raised); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; max-width: 640px; margin: 0 auto; }
|
|
373
|
+
.code-header { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
|
|
374
|
+
.code-dot { width: 10px; height: 10px; border-radius: 50%; }
|
|
375
|
+
.code-dot.red { background: #f87171; }
|
|
376
|
+
.code-dot.yellow { background: #fbbf24; }
|
|
377
|
+
.code-dot.green { background: #4ade80; }
|
|
378
|
+
.code-header span { font-size: 12px; color: var(--text-muted); margin-left: 8px; }
|
|
379
|
+
.code-body { padding: 20px; font-family: var(--mono); font-size: 13px; line-height: 1.7; overflow-x: auto; }
|
|
380
|
+
.code-body .comment { color: #6b7280; }
|
|
381
|
+
.code-body .keyword { color: #c084fc; }
|
|
382
|
+
.code-body .string { color: #4ade80; }
|
|
383
|
+
.code-body .fn { color: var(--cyan); }
|
|
384
|
+
|
|
385
|
+
/* PRICING */
|
|
386
|
+
.pricing { padding: 80px 0; }
|
|
387
|
+
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; max-width: 1080px; margin: 0 auto; }
|
|
388
|
+
.price-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; padding: 32px 28px; }
|
|
389
|
+
.price-card.pro { border-color: rgba(34,211,238,0.35); }
|
|
390
|
+
.price-card.free-highlight { border-color: var(--cyan); box-shadow: 0 0 40px var(--cyan-dim), inset 0 1px 0 rgba(34,211,238,0.15); }
|
|
391
|
+
.price-card.team { border-color: rgba(74,222,128,0.45); box-shadow: inset 0 1px 0 rgba(74,222,128,0.16); }
|
|
392
|
+
.price-card .tier { font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); font-weight: 600; margin-bottom: 8px; }
|
|
393
|
+
.price-card.pro .tier { color: var(--cyan); }
|
|
394
|
+
.price-card.team .tier { color: var(--green); }
|
|
395
|
+
.price-card .price { font-size: 40px; font-weight: 700; letter-spacing: -0.03em; margin-bottom: 4px; }
|
|
396
|
+
.price-card .price-sub { font-size: 13px; color: var(--text-muted); margin-bottom: 24px; }
|
|
397
|
+
.price-card ul { list-style: none; margin-bottom: 28px; }
|
|
398
|
+
.price-card li { font-size: 14px; color: var(--text-muted); padding: 6px 0; display: flex; align-items: flex-start; gap: 8px; }
|
|
399
|
+
.price-card li::before { content: "✓"; color: var(--cyan); font-weight: 700; flex-shrink: 0; }
|
|
400
|
+
.price-card.pro li::before { color: var(--cyan); }
|
|
401
|
+
.btn-free,
|
|
402
|
+
.btn-demo-link { display: block; text-align: center; padding: 10px; border: 1px solid var(--border); border-radius: 8px; color: var(--text); text-decoration: none; font-size: 14px; font-weight: 500; transition: border-color 0.15s; }
|
|
403
|
+
.btn-free:hover,
|
|
404
|
+
.btn-demo-link:hover { border-color: var(--text-muted); }
|
|
405
|
+
.btn-pro { display: block; text-align: center; padding: 10px; background: var(--cyan); color: var(--bg); border-radius: 8px; text-decoration: none; font-size: 14px; font-weight: 600; transition: opacity 0.15s; }
|
|
406
|
+
.btn-pro:hover { opacity: 0.85; }
|
|
407
|
+
.btn-team { display: block; text-align: center; padding: 10px; background: rgba(74,222,128,0.14); color: var(--green); border: 1px solid rgba(74,222,128,0.4); border-radius: 8px; text-decoration: none; font-size: 14px; font-weight: 600; transition: border-color 0.15s, transform 0.15s; }
|
|
408
|
+
.btn-team:hover { border-color: var(--green); transform: translateY(-1px); }
|
|
409
|
+
.team-form { max-width: 860px; margin: 24px auto 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
|
|
410
|
+
.team-form .full { grid-column: 1 / -1; }
|
|
411
|
+
.team-form input, .team-form textarea { width: 100%; background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; color: var(--text); font-size: 14px; font-family: inherit; }
|
|
412
|
+
.team-form textarea { min-height: 120px; resize: vertical; }
|
|
413
|
+
.team-form button { width: 100%; }
|
|
414
|
+
|
|
415
|
+
/* FAQ */
|
|
416
|
+
.faq { padding: 80px 0; }
|
|
417
|
+
.faq-list { max-width: 640px; margin: 0 auto; }
|
|
418
|
+
.faq-item { border-bottom: 1px solid var(--border); }
|
|
419
|
+
.faq-q { padding: 20px 0; font-size: 15px; font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
|
|
420
|
+
.faq-q::after { content: "+"; font-size: 18px; color: var(--text-muted); transition: transform 0.2s; }
|
|
421
|
+
.faq-item.open .faq-q::after { transform: rotate(45deg); }
|
|
422
|
+
.faq-a { font-size: 14px; color: var(--text-muted); line-height: 1.65; padding-bottom: 20px; display: none; }
|
|
423
|
+
.faq-item.open .faq-a { display: block; }
|
|
424
|
+
|
|
425
|
+
/* CTA SECTION */
|
|
426
|
+
.final-cta { padding: 80px 0; text-align: center; }
|
|
427
|
+
.final-cta h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 700; letter-spacing: -0.025em; margin-bottom: 12px; }
|
|
428
|
+
.final-cta p { font-size: 15px; color: var(--text-muted); margin-bottom: 28px; }
|
|
429
|
+
.final-cta .btn-pro, .final-cta .btn-team { display: inline-block; padding: 12px 32px; font-size: 15px; border-radius: 8px; margin: 0 6px; }
|
|
430
|
+
|
|
431
|
+
/* STICKY BOTTOM CTA BAR */
|
|
432
|
+
.sticky-cta { position: fixed; bottom: 0; left: 0; right: 0; z-index: 999; background: rgba(10,10,10,0.96); border-top: 1px solid var(--border); padding: 12px 20px; display: flex; align-items: center; justify-content: center; gap: 12px; transform: translateY(100%); transition: transform 0.3s ease; backdrop-filter: blur(8px); }
|
|
433
|
+
.sticky-cta.visible { transform: translateY(0); }
|
|
434
|
+
.sticky-cta-text { font-size: 14px; color: var(--text-muted); }
|
|
435
|
+
.sticky-cta-text strong { color: var(--text); }
|
|
436
|
+
.sticky-cta .btn-pro, .sticky-cta .btn-gpt-page { padding: 8px 20px; font-size: 13px; border-radius: 6px; white-space: nowrap; }
|
|
437
|
+
|
|
438
|
+
/* FOOTER */
|
|
439
|
+
footer { border-top: 1px solid var(--border); padding: 32px 0; }
|
|
440
|
+
footer .container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
|
|
441
|
+
.footer-links { display: flex; gap: 20px; }
|
|
442
|
+
.footer-links a { color: var(--text-muted); text-decoration: none; font-size: 13px; transition: color 0.15s; }
|
|
443
|
+
.footer-links a:hover { color: var(--text); }
|
|
444
|
+
.footer-copy { font-size: 12px; color: var(--text-muted); }
|
|
445
|
+
|
|
446
|
+
/* RESPONSIVE */
|
|
447
|
+
@media (max-width: 700px) {
|
|
448
|
+
.steps { grid-template-columns: 1fr; }
|
|
449
|
+
.compatibility-grid { grid-template-columns: 1fr; }
|
|
450
|
+
.gpt-steps { grid-template-columns: 1fr; }
|
|
451
|
+
.seo-grid { grid-template-columns: 1fr; }
|
|
452
|
+
.pricing-grid { grid-template-columns: 1fr; }
|
|
453
|
+
.team-form { grid-template-columns: 1fr; }
|
|
454
|
+
.hero { padding: 72px 0 56px; }
|
|
455
|
+
.hero-actions { flex-direction: column; }
|
|
456
|
+
.hero-actions a { width: 100%; }
|
|
457
|
+
.nav-links a:not(.nav-cta) { display: none; }
|
|
458
|
+
.proof-bar { gap: 16px; }
|
|
459
|
+
.proof-bar .dot { display: none; }
|
|
460
|
+
}
|
|
461
|
+
</style>
|
|
462
|
+
<!-- PostHog Analytics -->
|
|
463
|
+
<script>
|
|
464
|
+
!function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.crossOrigin="anonymous",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a=u._i.push([i,s,a]),u._i.push([i,s,a]),u.init=function(t,e,i){g(u,"capture"),u.push(["init",t,e,i])},u.capture=function(t,e,i,o){u.push(["capture",t,e,i,o])},u.identify=function(t,e,i){u.push(["identify",t,e,i])},u.alias=function(t,e){u.push(["alias",t,e])},u.people={set:function(t,e,i){u.push(["people.set",t,e,i])}},u.featureFlags={},u.onFeatureFlags=function(t){u.push(["onFeatureFlags",t])},u.toString=function(t){var e="posthog";return a&&a!==e&&(e+="."+a),t||(e+=" (stub)"),e},u.people.set_once=function(t,e,i){u.push(["people.set_once",t,e,i])},u.group=function(t,e,i){u.push(["group",t,e,i])},u.setPersonPropertiesForFlags=function(t){u.push(["setPersonPropertiesForFlags",t])},u.resetGroupPropertiesForFlags=function(t){u.push(["resetGroupPropertiesForFlags",t])},u.setGroupPropertiesForFlags=function(t){u.push(["setGroupPropertiesForFlags",t])},u.reloadFeatureFlags=function(){u.push(["reloadFeatureFlags"])},u.capture=function(t,e,i,o){u.push(["capture",t,e,i,o])},u.identify=function(t,e,i){u.push(["identify",t,e,i])},0===t.indexOf(".")){var s=t.substring(1);u=e[s]=[],u._i=[]}e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
|
|
465
|
+
posthog.init('__POSTHOG_API_KEY__', {
|
|
466
|
+
api_host: '/ingest',
|
|
467
|
+
ui_host: 'https://us.posthog.com',
|
|
468
|
+
person_profiles: 'identified_only',
|
|
469
|
+
});
|
|
470
|
+
posthog.capture('$pageview');
|
|
471
|
+
</script>
|
|
472
|
+
</head>
|
|
473
|
+
<body>
|
|
474
|
+
|
|
475
|
+
<!-- NAV -->
|
|
476
|
+
<nav>
|
|
477
|
+
<div class="container">
|
|
478
|
+
<a href="#" class="nav-logo"><span>👍👎</span> ThumbGate</a>
|
|
479
|
+
<div class="nav-links">
|
|
480
|
+
<a href="#how-it-works">How It Works</a>
|
|
481
|
+
<a href="#compatibility">Compatibility</a>
|
|
482
|
+
<a href="#compare-guides">Comparisons</a>
|
|
483
|
+
<a href="#pricing">Pricing</a>
|
|
484
|
+
<a href="#faq">FAQ</a>
|
|
485
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate" target="_blank" rel="noopener">GitHub</a>
|
|
486
|
+
<a href="/guide">Setup Guide</a>
|
|
487
|
+
<a href="/learn">Learn</a>
|
|
488
|
+
<a href="/compare">Compare</a>
|
|
489
|
+
<a href="/dashboard">Dashboard Demo</a>
|
|
490
|
+
<a href="#workflow-sprint-intake" onclick="posthog.capture('workflow_sprint')">Start Sprint</a>
|
|
491
|
+
<a href="/go/gpt?utm_source=website&utm_medium=nav&utm_campaign=chatgpt_gpt&cta_id=nav_open_gpt&cta_placement=nav" target="_blank" rel="noopener" onclick="posthog.capture('nav_cta_click',{cta:'open_gpt'})" class="nav-cta">Open GPT</a>
|
|
492
|
+
</div>
|
|
493
|
+
</div>
|
|
494
|
+
</nav>
|
|
495
|
+
|
|
496
|
+
<!-- HERO -->
|
|
497
|
+
<section class="hero">
|
|
498
|
+
<div class="container">
|
|
499
|
+
<div class="hero-thumbs">👍👎</div>
|
|
500
|
+
<div class="hero-badge">● Stop costly AI mistakes before they run</div>
|
|
501
|
+
<h1>Stop AI agents before<br>they make costly mistakes.</h1>
|
|
502
|
+
<p style="font-size:18px;color:var(--text-muted);max-width:640px;margin:0 auto 20px;line-height:1.6;">Paste a risky command, file edit, deploy, payment, API call, or email into the live ThumbGate GPT for allow, block, or checkpoint guidance.<br><strong style="color:var(--text)">Then enforce locally with <code>npx thumbgate init</code> where your agent actually executes.</strong></p>
|
|
503
|
+
<div class="hero-signals">
|
|
504
|
+
<div class="signal-pill signal-down">👎 Prevent expensive mistakes: force-pushes, destructive SQL, bad deploys</div>
|
|
505
|
+
<div class="signal-pill signal-up">✅ Fix it once, then block the repeat before the next tool call</div>
|
|
506
|
+
<div class="signal-pill">🔁 Turn a smart assistant into a reliable operator</div>
|
|
507
|
+
</div>
|
|
508
|
+
<p class="hero-persona" style="display:none">For consultancies, platform teams, and AI product teams with one workflow owner, one repeated failure, and one buyer who needs proof before a wider rollout.</p>
|
|
509
|
+
<div class="hero-actions" style="margin-top:32px;">
|
|
510
|
+
<div class="hero-install hero-install-primary" onclick="copyInstall(this)" title="Click to copy" style="margin-bottom:0;font-size:20px;padding:18px 32px;border:2px solid var(--cyan);box-shadow:0 0 32px var(--cyan-glow);">
|
|
511
|
+
<span class="prompt">$</span>
|
|
512
|
+
<span class="cmd">npx thumbgate init</span>
|
|
513
|
+
<span class="copy-hint">click to copy</span>
|
|
514
|
+
</div>
|
|
515
|
+
<a href="/go/install?utm_source=website&utm_medium=hero_cta&utm_campaign=install_free&cta_id=hero_install_cli&cta_placement=hero" onclick="posthog.capture('hero_install_click',{cta:'install_cli'})" class="btn-gpt-page btn-install-hero" style="font-size:18px;padding:16px 36px;">Install Free CLI</a>
|
|
516
|
+
<a href="/go/pro?utm_source=website&utm_medium=hero_cta&utm_campaign=pro_upgrade&cta_id=hero_go_pro&cta_placement=hero&plan_id=pro&landing_path=%2F" onclick="posthog.capture('hero_pro_click',{cta:'go_pro'})" class="btn-pro-page" style="font-size:13px;padding:10px 18px;margin-bottom:4px;opacity:0.85;">Upgrade to Pro — $19/mo</a>
|
|
517
|
+
<a href="/go/gpt?utm_source=website&utm_medium=hero_cta&utm_campaign=chatgpt_gpt&cta_id=hero_open_gpt&cta_placement=hero" class="btn-gpt-page" target="_blank" rel="noopener" onclick="posthog.capture('hero_cta_click',{cta:'open_gpt'})" style="font-size:13px;padding:10px 18px;background:transparent;border:1px solid var(--green);color:var(--green);">Open ThumbGate GPT</a>
|
|
518
|
+
<a href="/go/github?utm_source=website&utm_medium=hero_cta&utm_campaign=github_repo&cta_id=hero_star_github&cta_placement=hero" target="_blank" rel="noopener" class="btn-free" style="display:inline-flex;align-items:center;gap:6px;padding:11px 20px;border-radius:999px;">⭐ Star on GitHub</a>
|
|
519
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/releases/latest/download/thumbgate-codex-plugin.zip" class="btn-install-link" target="_blank" rel="noopener" style="font-size:13px;color:var(--text-muted);text-decoration:none;padding:8px 14px;">Install Codex plugin →</a>
|
|
520
|
+
</div>
|
|
521
|
+
<p style="font-size:13px;color:var(--text-muted);margin:16px auto 0;max-width:660px;">No, you do not have to chat inside the GPT forever. The GPT is advice and checkpointing; local hooks do the hard blocking for Claude Code, Cursor, Codex, Gemini, Amp, OpenCode, and MCP-compatible agents.</p>
|
|
522
|
+
<p style="font-size:13px;color:var(--text-muted);margin:8px auto 28px;max-width:560px;">Free local CLI proves the enforcement loop on one machine. Pro adds personal enforcement proof, the gate debugger, DPO export, and a dashboard. Team shares the gates across seats. <a href="#pricing" style="color:var(--cyan);text-decoration:none;">See all plans →</a></p>
|
|
523
|
+
<div class="proof-bar">
|
|
524
|
+
<a href="/guide" rel="noopener">CLI-first setup guide →</a>
|
|
525
|
+
<span class="dot"></span>
|
|
526
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/releases/latest/download/thumbgate-claude-desktop.mcpb" target="_blank" rel="noopener">Claude plugin bundle →</a>
|
|
527
|
+
<span class="dot"></span>
|
|
528
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/docs/CLAUDE_DESKTOP_EXTENSION.md" target="_blank" rel="noopener">Claude submission packet →</a>
|
|
529
|
+
<span class="dot"></span>
|
|
530
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/.claude-plugin/README.md" target="_blank" rel="noopener">Claude marketplace install →</a>
|
|
531
|
+
<span class="dot"></span>
|
|
532
|
+
<a href="/go/gpt?utm_source=website&utm_medium=proof_bar&utm_campaign=chatgpt_gpt&cta_id=proof_bar_open_gpt&cta_placement=proof_bar" target="_blank" rel="noopener">Open ThumbGate GPT →</a>
|
|
533
|
+
<span class="dot"></span>
|
|
534
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/adapters/chatgpt/INSTALL.md" target="_blank" rel="noopener">ChatGPT Actions setup →</a>
|
|
535
|
+
<span class="dot"></span>
|
|
536
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/releases/latest/download/thumbgate-codex-plugin.zip" target="_blank" rel="noopener">Codex plugin download →</a>
|
|
537
|
+
<span class="dot"></span>
|
|
538
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/docs/VERIFICATION_EVIDENCE.md" target="_blank" rel="noopener">Verification evidence →</a>
|
|
539
|
+
<span class="dot"></span>
|
|
540
|
+
<a href="https://arxiv.org/abs/2603.18743" target="_blank" rel="noopener">Research-backed (Memento-Skills, arXiv 2603.18743) →</a>
|
|
541
|
+
<span class="dot"></span>
|
|
542
|
+
<a href="https://blog.langchain.dev/continual-learning-for-ai-agents/" target="_blank" rel="noopener">Three-layer continual learning (LangChain) →</a>
|
|
543
|
+
<span class="dot"></span>
|
|
544
|
+
<a href="https://cloud.google.com/blog/topics/healthcare-life-sciences/ensuring-safety-and-quality-in-healthcare-qa-agents" target="_blank" rel="noopener">Google Cloud safety framework architecture →</a>
|
|
545
|
+
<span class="dot"></span>
|
|
546
|
+
<a href="https://www.nytimes.com/2026/04/06/technology/ai-cybersecurity.html" target="_blank" rel="noopener">NYT: AI agents as attack vectors (April 2026) →</a>
|
|
547
|
+
<span class="dot"></span>
|
|
548
|
+
<a href="https://www.producthunt.com/products/thumbgate" target="_blank" rel="noopener">Product Hunt →</a>
|
|
549
|
+
<span class="dot"></span>
|
|
550
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/actions" target="_blank" rel="noopener">Proof-backed CI →</a>
|
|
551
|
+
<span class="dot"></span>
|
|
552
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/docs/RELEASE_CONFIDENCE.md" target="_blank" rel="noopener">Release confidence →</a>
|
|
553
|
+
<span class="dot"></span>
|
|
554
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/docs/THUMBGATE_BENCH.md" target="_blank" rel="noopener">ThumbGate Bench →</a>
|
|
555
|
+
<span class="dot"></span>
|
|
556
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/actions" target="_blank" rel="noopener">CI and proof lanes →</a>
|
|
557
|
+
<span class="dot"></span>
|
|
558
|
+
<a href="#compatibility">Claude Code · Cursor · Codex · Gemini · Amp · OpenCode</a>
|
|
559
|
+
</div>
|
|
560
|
+
</div>
|
|
561
|
+
</section>
|
|
562
|
+
|
|
563
|
+
<section class="gpt-path" id="thumbgate-gpt">
|
|
564
|
+
<div class="container">
|
|
565
|
+
<div class="gpt-panel">
|
|
566
|
+
<div class="section-label" style="text-align:left;">ChatGPT Entry Point · Live ThumbGate GPT for ChatGPT</div>
|
|
567
|
+
<h2>Open the GPT. Check the action. Turn the lesson into a gate.</h2>
|
|
568
|
+
<p>ThumbGate should meet users where they already ask AI for help. The live GPT is the lowest-friction way to prevent an expensive AI mistake before installing anything.</p>
|
|
569
|
+
<div class="gpt-steps">
|
|
570
|
+
<div class="gpt-step">
|
|
571
|
+
<strong>1. Try the live GPT</strong>
|
|
572
|
+
<p>Paste a proposed command, file edit, merge, deploy, payment, email, or API call and ask whether to allow, block, or checkpoint it.</p>
|
|
573
|
+
</div>
|
|
574
|
+
<div class="gpt-step">
|
|
575
|
+
<strong>2. Save the signal</strong>
|
|
576
|
+
<p>Reply with <code>thumbs up:</code> or <code>thumbs down:</code> plus one concrete sentence. One signal becomes one remembered rule.</p>
|
|
577
|
+
</div>
|
|
578
|
+
<div class="gpt-step">
|
|
579
|
+
<strong>3. Enforce locally</strong>
|
|
580
|
+
<p>Run <code>npx thumbgate init</code> in the repo so Pre-Action Gates block repeated mistakes before the coding agent executes them.</p>
|
|
581
|
+
</div>
|
|
582
|
+
</div>
|
|
583
|
+
<div style="display:flex;gap:12px;flex-wrap:wrap;">
|
|
584
|
+
<a href="/go/gpt?utm_source=website&utm_medium=gpt_section&utm_campaign=chatgpt_gpt&cta_id=gpt_path_open_gpt&cta_placement=gpt_section" class="btn-gpt-page" target="_blank" rel="noopener" onclick="posthog.capture('gpt_path_cta_click',{cta:'open_gpt'})">Open ThumbGate GPT</a>
|
|
585
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/adapters/chatgpt/INSTALL.md" class="btn-free" target="_blank" rel="noopener" style="display:inline-flex;align-items:center;padding:12px 20px;border-radius:8px;">ChatGPT Actions setup</a>
|
|
586
|
+
</div>
|
|
587
|
+
<p class="gpt-note"><strong>Plain English rule:</strong> ChatGPT is the discovery and memory surface for advice, checkpointing, and typed feedback capture. The hard Reliability Gateway still runs in the local agent or CI lane.</p>
|
|
588
|
+
</div>
|
|
589
|
+
</div>
|
|
590
|
+
</section>
|
|
591
|
+
|
|
592
|
+
<section class="compatibility" id="compatibility">
|
|
593
|
+
<div class="container">
|
|
594
|
+
<div class="section-label">Compatibility</div>
|
|
595
|
+
<h2 class="section-title">One gateway across the agent surfaces you already use</h2>
|
|
596
|
+
<div class="compatibility-grid">
|
|
597
|
+
<a class="compat-card" href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/plugins/claude-codex-bridge/INSTALL.md" target="_blank" rel="noopener">
|
|
598
|
+
<h3>🤖 AI CLIs</h3>
|
|
599
|
+
<p>Claude Code, Claw-code, Codex, Gemini CLI, Amp, and OpenCode all use the same gateway and memory model. Any MCP-compatible agent gets pre-action gates, feedback memory, and enforcement out of the box.</p>
|
|
600
|
+
<div class="card-arrow">View setup guide →</div>
|
|
601
|
+
</a>
|
|
602
|
+
<a class="compat-card" href="https://github.com/IgorGanapolsky/ThumbGate/blob/main/plugins/codex-profile/INSTALL.md" target="_blank" rel="noopener">
|
|
603
|
+
<h3>🧩 Codex plugin</h3>
|
|
604
|
+
<p>Codex ships with a published standalone ThumbGate plugin bundle plus a repo-local plugin profile. Download the zip, extract it, and install without wiring MCP by hand.</p>
|
|
605
|
+
<div class="card-arrow">Get the Codex plugin →</div>
|
|
606
|
+
</a>
|
|
607
|
+
<a class="compat-card" href="/go/gpt?utm_source=website&utm_medium=compatibility&utm_campaign=chatgpt_gpt&cta_id=compat_open_gpt&cta_placement=compatibility" target="_blank" rel="noopener">
|
|
608
|
+
<h3>💬 ChatGPT GPT Actions</h3>
|
|
609
|
+
<p>Open the ThumbGate GPT to check proposed AI actions, capture thumbs-up/down lessons, and get setup guidance. Real blocking for coding agents still runs locally after <code>npx thumbgate init</code>.</p>
|
|
610
|
+
<div class="card-arrow">Open ThumbGate GPT →</div>
|
|
611
|
+
</a>
|
|
612
|
+
<a class="compat-card" href="/guides/claude-desktop">
|
|
613
|
+
<h3>🧩 Claude Desktop plugin</h3>
|
|
614
|
+
<p>Install the published <code>.mcpb</code> bundle today, point buyers at the submission packet, and let Claude Code users add the repo marketplace while the official directory review is still pending.</p>
|
|
615
|
+
<div class="card-arrow">Get the Claude plugin →</div>
|
|
616
|
+
</a>
|
|
617
|
+
<a class="compat-card" href="https://github.com/IgorGanapolsky/ThumbGate/tree/main/plugins" target="_blank" rel="noopener">
|
|
618
|
+
<h3>✏️ Editor workflows</h3>
|
|
619
|
+
<p>Cursor ships with a bundled marketplace plugin. VS Code works when you run an MCP-compatible agent inside it.</p>
|
|
620
|
+
<div class="card-arrow">Browse plugins →</div>
|
|
621
|
+
</a>
|
|
622
|
+
<a class="compat-card seo-card" href="https://github.com/IgorGanapolsky/ThumbGate/tree/main/.claude/skills/thumbgate" target="_blank" rel="noopener">
|
|
623
|
+
<h3>⚡ Claude Code Skill</h3>
|
|
624
|
+
<p>Type <code>/thumbgate</code> in any Claude Code session. Auto-triggers on "gate", "feedback", "block mistake". Free skill on top of the same local gateway teams later harden into a shared workflow.</p>
|
|
625
|
+
<div class="card-arrow">View skill on GitHub →</div>
|
|
626
|
+
</a>
|
|
627
|
+
</div>
|
|
628
|
+
</div>
|
|
629
|
+
</section>
|
|
630
|
+
|
|
631
|
+
<section class="compatibility" id="social-proof">
|
|
632
|
+
<div class="container">
|
|
633
|
+
<div class="section-label">See It In Action</div>
|
|
634
|
+
<h2 class="section-title">See the enforcement before you buy anything</h2>
|
|
635
|
+
<div class="agent-grid">
|
|
636
|
+
<div class="agent-card">
|
|
637
|
+
<h3>🔍 Live Dashboard Demo</h3>
|
|
638
|
+
<p>Search lessons, inspect gates, and see exactly why risky actions were blocked. No signup or install required.</p>
|
|
639
|
+
<a href="/dashboard" style="display:inline-block;margin-top:12px;color:var(--cyan);font-weight:600;text-decoration:underline;">Open Dashboard Demo →</a>
|
|
640
|
+
</div>
|
|
641
|
+
<div class="agent-card">
|
|
642
|
+
<h3>⛔ Gate Reasoning Chains</h3>
|
|
643
|
+
<p>Every block explains why: which pattern matched, what evidence triggered it, and whether the rule came from your own corrections.</p>
|
|
644
|
+
</div>
|
|
645
|
+
<div class="agent-card">
|
|
646
|
+
<h3>📊 Org Dashboard (Team)</h3>
|
|
647
|
+
<p>See which agents are creating review churn, which gates are saving time, and where rollout risk is still concentrated across the shared workflow.</p>
|
|
648
|
+
</div>
|
|
649
|
+
<div class="agent-card">
|
|
650
|
+
<h3>🧱 Isolated Execution Lanes</h3>
|
|
651
|
+
<p>High-risk local autonomy can route into Docker Sandboxes, while hosted team automations use a signed sandbox dispatch lane instead of running loose on a shared host.</p>
|
|
652
|
+
</div>
|
|
653
|
+
<div class="agent-card">
|
|
654
|
+
<h3>🧪 Thompson Sampling</h3>
|
|
655
|
+
<p>Confidence tiers (none/low/medium/high) tell you when to trust the model vs fall back to rules. No guessing.</p>
|
|
656
|
+
</div>
|
|
657
|
+
<div class="agent-card">
|
|
658
|
+
<h3>🪞 History-Aware Lessons</h3>
|
|
659
|
+
<p>When the current Claude auto-capture hook only gets a vague thumbs-down, ThumbGate can reuse up to 8 prior recorded entries plus the failed tool call, then keep a linked 60-second feedback session open for later corrections instead of creating a dead-end note.</p>
|
|
660
|
+
</div>
|
|
661
|
+
</div>
|
|
662
|
+
</div>
|
|
663
|
+
</section>
|
|
664
|
+
|
|
665
|
+
<section class="seo-pages" id="compare-guides">
|
|
666
|
+
<div class="container">
|
|
667
|
+
<div class="section-label">Popular Buyer Questions</div>
|
|
668
|
+
<h2 class="section-title">How buyers discover ThumbGate in search and AI answers</h2>
|
|
669
|
+
<div class="seo-grid">
|
|
670
|
+
<a class="seo-card" href="/compare/speclock">
|
|
671
|
+
<div class="seo-kicker">Comparison</div>
|
|
672
|
+
<h3>ThumbGate vs SpecLock</h3>
|
|
673
|
+
<p>Why thumbs-up/down feedback and pre-action gates solve repeated mistakes faster than a manual spec-authoring loop.</p>
|
|
674
|
+
<div class="card-arrow">Read the comparison →</div>
|
|
675
|
+
</a>
|
|
676
|
+
<a class="seo-card" href="/compare/mem0">
|
|
677
|
+
<div class="seo-kicker">Comparison</div>
|
|
678
|
+
<h3>ThumbGate vs Mem0</h3>
|
|
679
|
+
<p>Mem0 remembers context. ThumbGate enforces behavior. Why retrieval alone is not enough when your agent keeps repeating the same mistakes.</p>
|
|
680
|
+
<div class="card-arrow">See the enforcement angle →</div>
|
|
681
|
+
</a>
|
|
682
|
+
<a class="seo-card" href="/guides/pre-action-gates">
|
|
683
|
+
<div class="seo-kicker">Guide</div>
|
|
684
|
+
<h3>What Are Pre-Action Gates?</h3>
|
|
685
|
+
<p>The core concept explained in plain language: how thumbs up, thumbs down, and runtime enforcement work together to prevent repeated failures.</p>
|
|
686
|
+
<div class="card-arrow">Read the guide →</div>
|
|
687
|
+
</a>
|
|
688
|
+
<a class="seo-card" href="/guides/claude-code-feedback">
|
|
689
|
+
<div class="seo-kicker">Integration</div>
|
|
690
|
+
<h3>Claude Code Feedback Memory That Enforces</h3>
|
|
691
|
+
<p>Why structured feedback memory matters more when it becomes a live gate that blocks your agent from repeating mistakes.</p>
|
|
692
|
+
<div class="card-arrow">Read the integration guide →</div>
|
|
693
|
+
</a>
|
|
694
|
+
<a class="seo-card" href="/guides/stop-repeated-ai-agent-mistakes">
|
|
695
|
+
<div class="seo-kicker">Problem Guide</div>
|
|
696
|
+
<h3>How to Stop AI Agents From Repeating Mistakes</h3>
|
|
697
|
+
<p>The shortest path from “I already corrected this once” to a pre-action gate that blocks the repeat before the next tool call lands.</p>
|
|
698
|
+
<div class="card-arrow">See the fix →</div>
|
|
699
|
+
</a>
|
|
700
|
+
<a class="seo-card" href="/guides/cursor-agent-guardrails">
|
|
701
|
+
<div class="seo-kicker">Cursor</div>
|
|
702
|
+
<h3>Cursor Guardrails That Block Repeat Failures</h3>
|
|
703
|
+
<p>Why Cursor users need more than prompts when the same risky refactor, shell step, or git action keeps coming back.</p>
|
|
704
|
+
<div class="card-arrow">Read the Cursor guide →</div>
|
|
705
|
+
</a>
|
|
706
|
+
<a class="seo-card" href="/guides/codex-cli-guardrails">
|
|
707
|
+
<div class="seo-kicker">Codex</div>
|
|
708
|
+
<h3>Codex CLI Guardrails That Actually Enforce</h3>
|
|
709
|
+
<p>Turn operator feedback into searchable lessons, linked prevention rules, and a runtime stop before Codex repeats the mistake.</p>
|
|
710
|
+
<div class="card-arrow">Read the Codex guide →</div>
|
|
711
|
+
</a>
|
|
712
|
+
<a class="seo-card" href="/guides/gemini-cli-feedback-memory">
|
|
713
|
+
<div class="seo-kicker">Gemini</div>
|
|
714
|
+
<h3>Gemini CLI Memory That Leads to Enforcement</h3>
|
|
715
|
+
<p>Why Gemini CLI buyers start with memory and convert when they see how memory becomes real pre-action gates.</p>
|
|
716
|
+
<div class="card-arrow">Read the Gemini guide →</div>
|
|
717
|
+
</a>
|
|
718
|
+
</div>
|
|
719
|
+
</div>
|
|
720
|
+
</section>
|
|
721
|
+
|
|
722
|
+
<!-- HOW IT WORKS -->
|
|
723
|
+
<section class="how-it-works" id="how-it-works">
|
|
724
|
+
<div class="container">
|
|
725
|
+
<div class="section-label">New in v1.4.6</div>
|
|
726
|
+
<h2 class="section-title">Three steps to stop repeated AI failures</h2>
|
|
727
|
+
<div class="steps">
|
|
728
|
+
<div class="step">
|
|
729
|
+
<div class="step-num">1</div>
|
|
730
|
+
<h3>Feedback</h3>
|
|
731
|
+
<p>Give <code>👍</code> or <code>👎</code> on your AI agent's actions. Feedback is stored in a SQLite+FTS5 lesson DB. In the current Claude auto-capture hook, a vague thumbs-down can distill from up to 8 prior recorded entries and the failed tool call before promotion, then stay linked to a 60-second feedback session. Example: you 👎 a risky migration → it auto-promotes to a "never run DROP on prod" gate.</p>
|
|
732
|
+
</div>
|
|
733
|
+
<div class="step">
|
|
734
|
+
<div class="step-num">2</div>
|
|
735
|
+
<h3>Distill + Rules</h3>
|
|
736
|
+
<p>Repeated failures auto-promote into prevention rules. Thompson Sampling adapts which rules fire, and the reflector lane can propose a reusable rule from the same transcript so high-risk patterns get stricter enforcement while low-risk ones stay relaxed.</p>
|
|
737
|
+
</div>
|
|
738
|
+
<div class="step">
|
|
739
|
+
<div class="step-num">3</div>
|
|
740
|
+
<h3>Gates</h3>
|
|
741
|
+
<p>Rules become Pre-Action Gates that <strong>block</strong> your agent before it repeats the same mistake. Your agent can't force-push, skip tests, or repeat a refactor you already rejected. No more fix-loops.</p>
|
|
742
|
+
</div>
|
|
743
|
+
</div>
|
|
744
|
+
</div>
|
|
745
|
+
</section>
|
|
746
|
+
|
|
747
|
+
<!-- PROENTROPIC -->
|
|
748
|
+
<!-- GUARDRAILS -->
|
|
749
|
+
<section class="compatibility" id="guardrails">
|
|
750
|
+
<div class="container">
|
|
751
|
+
<div class="section-label">Enforcement</div>
|
|
752
|
+
<h2 class="section-title">Gates block. They don't ask nicely.</h2>
|
|
753
|
+
<div class="agent-grid">
|
|
754
|
+
<div class="agent-card">
|
|
755
|
+
<h3>Don't trust — verify</h3>
|
|
756
|
+
<p>Every block shows why: pattern match, evidence, confidence score.</p>
|
|
757
|
+
</div>
|
|
758
|
+
<div class="agent-card">
|
|
759
|
+
<h3>Real tools, not wishes</h3>
|
|
760
|
+
<p>Gates physically block tool calls. Not prompt tricks. Not "please don't."</p>
|
|
761
|
+
</div>
|
|
762
|
+
<div class="agent-card">
|
|
763
|
+
<h3>Force models to show work</h3>
|
|
764
|
+
<p>Reasoning chains on every gate decision. Thompson Sampling confidence tiers.</p>
|
|
765
|
+
</div>
|
|
766
|
+
<div class="agent-card">
|
|
767
|
+
<h3>Log everything, learn automatically</h3>
|
|
768
|
+
<p>Repeated failures auto-promote to gates. Org dashboard shows all agents.</p>
|
|
769
|
+
</div>
|
|
770
|
+
<div class="agent-card">
|
|
771
|
+
<h3>Keep risky runs off the host</h3>
|
|
772
|
+
<p>When Workflow Sentinel predicts a risky local action, ThumbGate can recommend Docker Sandboxes before the agent touches the host filesystem or broader credentials.</p>
|
|
773
|
+
</div>
|
|
774
|
+
<div class="agent-card">
|
|
775
|
+
<h3>Ship with versioned proof</h3>
|
|
776
|
+
<p>Changesets, SemVer, sync checks, and verification evidence make new package releases inspectable before a buyer trusts the next rollout.</p>
|
|
777
|
+
</div>
|
|
778
|
+
</div>
|
|
779
|
+
</div>
|
|
780
|
+
</section>
|
|
781
|
+
|
|
782
|
+
<!-- CODE EXAMPLE -->
|
|
783
|
+
<section class="code-section">
|
|
784
|
+
<div class="container">
|
|
785
|
+
<div class="code-block">
|
|
786
|
+
<div class="code-header">
|
|
787
|
+
<div class="code-dot red"></div>
|
|
788
|
+
<div class="code-dot yellow"></div>
|
|
789
|
+
<div class="code-dot green"></div>
|
|
790
|
+
<span>terminal</span>
|
|
791
|
+
</div>
|
|
792
|
+
<div class="code-body">
|
|
793
|
+
<div><span class="comment"># Install in 30 seconds</span></div>
|
|
794
|
+
<div><span class="fn">npx</span> thumbgate init</div>
|
|
795
|
+
<div> </div>
|
|
796
|
+
<div><span class="comment"># Your agent tries to delete production db...</span></div>
|
|
797
|
+
<div><span class="keyword">⛔ Gate blocked:</span> <span class="string">"Never run DROP on production tables"</span></div>
|
|
798
|
+
<div><span class="comment"># Rule auto-generated from your previous 👎</span></div>
|
|
799
|
+
<div> </div>
|
|
800
|
+
<div><span class="comment"># Works with your existing setup</span></div>
|
|
801
|
+
<div><span class="fn">npx</span> thumbgate init <span class="comment"># bootstraps .thumbgate and .mcp.json</span></div>
|
|
802
|
+
<div><span class="comment"># Use repo guides for Claude plugin, Codex app plugin, Cursor plugin, and OpenCode profiles</span></div>
|
|
803
|
+
</div>
|
|
804
|
+
</div>
|
|
805
|
+
</div>
|
|
806
|
+
</section>
|
|
807
|
+
|
|
808
|
+
<section id="install" style="padding: 60px 40px; max-width: 900px; margin: 0 auto;">
|
|
809
|
+
<h2 style="font-size: 2em; text-align: center; margin-bottom: 40px;">Install for Your Agent</h2>
|
|
810
|
+
|
|
811
|
+
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 24px;">
|
|
812
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
813
|
+
<h3>Claude Code</h3>
|
|
814
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate init --agent claude-code</code>
|
|
815
|
+
<p style="color: #8b949e; font-size: 14px;">Wires PreToolUse hooks automatically</p>
|
|
816
|
+
</div>
|
|
817
|
+
|
|
818
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
819
|
+
<h3>Cursor</h3>
|
|
820
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate init --agent cursor</code>
|
|
821
|
+
<p style="color: #8b949e; font-size: 14px;">4 skills: feedback, rules, search, recall</p>
|
|
822
|
+
</div>
|
|
823
|
+
|
|
824
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
825
|
+
<h3>Codex</h3>
|
|
826
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate init --agent codex</code>
|
|
827
|
+
<p style="color: #8b949e; font-size: 14px;">6 skills including adversarial review</p>
|
|
828
|
+
</div>
|
|
829
|
+
|
|
830
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
831
|
+
<h3>Gemini CLI</h3>
|
|
832
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate init --agent gemini</code>
|
|
833
|
+
<p style="color: #8b949e; font-size: 14px;">Gemini CLI integration</p>
|
|
834
|
+
</div>
|
|
835
|
+
|
|
836
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
837
|
+
<h3>Amp</h3>
|
|
838
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate init --agent amp</code>
|
|
839
|
+
<p style="color: #8b949e; font-size: 14px;">Amp agent integration</p>
|
|
840
|
+
</div>
|
|
841
|
+
|
|
842
|
+
<div style="background: #161b22; border-radius: 12px; padding: 24px; border: 1px solid #30363d;">
|
|
843
|
+
<h3>Any MCP Client</h3>
|
|
844
|
+
<code style="display: block; background: #0d1117; padding: 12px; border-radius: 8px; color: #58a6ff; margin: 12px 0;">npx thumbgate serve</code>
|
|
845
|
+
<p style="color: #8b949e; font-size: 14px;">MCP stdio server for any compatible client</p>
|
|
846
|
+
</div>
|
|
847
|
+
</div>
|
|
848
|
+
|
|
849
|
+
<div style="text-align: center; margin-top: 40px;">
|
|
850
|
+
<h3>Claude Desktop</h3>
|
|
851
|
+
<p style="color: #8b949e;">Add to your <code>claude_desktop_config.json</code>:</p>
|
|
852
|
+
<pre style="background: #0d1117; padding: 16px; border-radius: 8px; color: #58a6ff; text-align: left; display: inline-block; margin: 12px auto;">{
|
|
853
|
+
"mcpServers": {
|
|
854
|
+
"thumbgate": {
|
|
855
|
+
"command": "npx",
|
|
856
|
+
"args": ["--yes", "--package", "thumbgate", "thumbgate", "serve"]
|
|
857
|
+
}
|
|
858
|
+
}
|
|
859
|
+
}</pre>
|
|
860
|
+
<p style="color: #8b949e; max-width: 760px; margin: 16px auto 0;">Official directory review is separate. Claude Code users can install immediately with <code>/plugin marketplace add IgorGanapolsky/ThumbGate</code> and <code>/plugin install thumbgate@thumbgate-marketplace</code>.</p>
|
|
861
|
+
</div>
|
|
862
|
+
</section>
|
|
863
|
+
|
|
864
|
+
<!-- PRICING -->
|
|
865
|
+
<section class="pricing" id="pricing">
|
|
866
|
+
<div class="container">
|
|
867
|
+
<div class="section-label">Pricing</div>
|
|
868
|
+
<h2 class="section-title">Install free. Pro adds enforcement proof. Team shares it across seats.</h2>
|
|
869
|
+
<div class="pricing-grid">
|
|
870
|
+
<div class="price-card free-highlight" style="border-color:var(--cyan);box-shadow:0 0 40px var(--cyan-dim), inset 0 1px 0 rgba(34,211,238,0.15);position:relative;">
|
|
871
|
+
<div style="position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:var(--cyan);color:#000;padding:4px 16px;border-radius:100px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;white-space:nowrap;">Most Popular</div>
|
|
872
|
+
<div class="tier" style="color:var(--cyan);">Free</div>
|
|
873
|
+
<div class="price">$0</div>
|
|
874
|
+
<div class="price-sub">Forever free · CLI-first local enforcement for one developer</div>
|
|
875
|
+
<p style="font-size:13px;color:#aaa;margin-bottom:16px;">For solo developers who want to stop the same agent mistake from showing up twice and prove local value before a team rollout conversation exists.</p>
|
|
876
|
+
<ul>
|
|
877
|
+
<li>3 feedback captures/day · 5 lesson searches/day · unlimited recall</li>
|
|
878
|
+
<li>5 auto-promoted gates plus the core safety policy</li>
|
|
879
|
+
<li>All MCP integrations (Claude Code, Cursor, Codex, etc.)</li>
|
|
880
|
+
<li>PreToolUse hook blocking</li>
|
|
881
|
+
<li>Local SQLite lesson DB</li>
|
|
882
|
+
<li>Unified context assembly — one call gets session, lessons, guards, and code-graph</li>
|
|
883
|
+
<li><a href="/guide" style="color:var(--cyan);text-decoration:underline;">Setup guide for all agents →</a></li>
|
|
884
|
+
</ul>
|
|
885
|
+
<div class="hero-install" onclick="copyInstall(this)" title="Click to copy" style="margin-bottom:12px;width:100%;justify-content:center;">
|
|
886
|
+
<span class="prompt">$</span>
|
|
887
|
+
<span class="cmd">npx thumbgate init</span>
|
|
888
|
+
<span class="copy-hint">click to copy</span>
|
|
889
|
+
</div>
|
|
890
|
+
<a href="https://www.npmjs.com/package/thumbgate" target="_blank" rel="noopener" class="btn-free">Install Free</a>
|
|
891
|
+
</div>
|
|
892
|
+
<div class="price-card pro" data-price-dollars="__PRO_PRICE_DOLLARS__">
|
|
893
|
+
<div class="tier">Solo Pro</div>
|
|
894
|
+
<div class="price">$19<span style="font-size:16px;color:var(--text-dim)">/mo</span></div>
|
|
895
|
+
<div class="price-sub">or $149/yr (save 35%) · Personal dashboard + enforcement proof</div>
|
|
896
|
+
<p style="font-size:13px;color:var(--cyan);margin-bottom:16px;font-weight:500;">For an individual operator who wants the gate debugger, personal dashboard, proof-ready exports, and export-ready evidence without starting the team rollout motion.</p>
|
|
897
|
+
<div class="pro-upgrade-triggers" style="font-size:12px;color:#aaa;margin-bottom:12px;">
|
|
898
|
+
<strong style="color:#fff;">Choose Pro when:</strong> you want review-ready evidence, need your own dashboard, or need to show which mistakes were blocked.
|
|
899
|
+
</div>
|
|
900
|
+
<div class="dashboard-preview" style="margin-bottom:16px;border:1px solid #333;border-radius:8px;overflow:hidden;">
|
|
901
|
+
<div style="background:linear-gradient(135deg,#1a1a2e 0%,#16213e 100%);padding:16px;text-align:center;">
|
|
902
|
+
<div style="font-size:11px;color:var(--cyan);text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;">What your Pro dashboard looks like</div>
|
|
903
|
+
<div style="background:#0d0d1a;border-radius:6px;padding:12px;text-align:left;font-family:monospace;font-size:11px;line-height:1.6;">
|
|
904
|
+
<div style="color:#4ade80;">✅ gate:no-force-push — blocked 12 times</div>
|
|
905
|
+
<div style="color:#4ade80;">✅ gate:require-tests — blocked 8 times</div>
|
|
906
|
+
<div style="color:#f87171;">❌ gate:no-drop-prod — FIRED (blocked DROP TABLE)</div>
|
|
907
|
+
<div style="color:#888;margin-top:6px;">DPO pairs exported: 47 | Lessons: 23 active</div>
|
|
908
|
+
</div>
|
|
909
|
+
</div>
|
|
910
|
+
</div>
|
|
911
|
+
<ul>
|
|
912
|
+
<li>Everything in Free, plus:</li>
|
|
913
|
+
<li><a href="/dashboard" style="color:var(--cyan);text-decoration:underline;">Visual gate debugger →</a> see every blocked action and the gate that fired so you can trust the system in minutes</li>
|
|
914
|
+
<li>Auto-connect — activate once with your license key, then your running agents appear automatically on your local dashboard</li>
|
|
915
|
+
<li><a href="/dashboard" style="color:var(--cyan);text-decoration:underline;">DPO training data export →</a> turn real thumbs-downs into ready-to-use preference pairs for fine-tuning (LoRA / JSONL)</li>
|
|
916
|
+
<li><strong>HuggingFace dataset export</strong> — share PII-redacted agent traces as open training datasets (<code>npm run export:hf</code>)</li>
|
|
917
|
+
<li><strong>Model Hardening Advisor</strong> — get recommendations on when and how to fine-tune your model to natively avoid recurring failures</li>
|
|
918
|
+
<li>Personal local dashboard — every Pro user gets a localhost dashboard without extra cloud setup</li>
|
|
919
|
+
<li>Review-ready workflow support — we help you wire the riskiest flows first: migrations, force-pushes, deploys, and CI</li>
|
|
920
|
+
</ul>
|
|
921
|
+
<div class="trial-badge" style="background:var(--cyan);color:#000;display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:700;margin-bottom:12px;">7-DAY FREE TRIAL</div>
|
|
922
|
+
<a href="/go/pro?utm_source=website&utm_medium=pricing_card&utm_campaign=pro_upgrade&cta_id=pricing_pro_upgrade&cta_placement=pricing&plan_id=pro&landing_path=%2F" class="btn-pro" onclick="posthog.capture('pricing_cta_click',{cta:'pro_upgrade',plan:'pro'})" style="display:block;width:100%;text-align:center;padding:12px;font-size:15px;">Upgrade to Pro — $19/mo</a>
|
|
923
|
+
<p style="font-size:11px;color:#666;margin-top:8px;">Start with the free CLI. Upgrade when you hit the 3 captures/day limit and need the dashboard, DPO export, and export-ready evidence.</p>
|
|
924
|
+
</div>
|
|
925
|
+
<div class="price-card team">
|
|
926
|
+
<div class="tier">Team</div>
|
|
927
|
+
<div class="price">$99<span style="font-size:16px;color:var(--text-dim)">/seat/mo</span></div>
|
|
928
|
+
<div class="price-sub">3-seat minimum · intake-led rollout for the first workflow</div>
|
|
929
|
+
<p style="font-size:13px;color:var(--green);margin-bottom:16px;font-weight:500;">For teams shipping AI-generated changes across shared repos who need one correction to protect every reviewer and runtime. This is the primary buying motion.</p>
|
|
930
|
+
<div class="pro-upgrade-triggers" style="font-size:12px;color:#aaa;margin-bottom:12px;">
|
|
931
|
+
<strong style="color:#fff;">Best first paid motion:</strong> one workflow, one owner, one proof review. Qualify the blocker first, then expand into seats.
|
|
932
|
+
</div>
|
|
933
|
+
<ul>
|
|
934
|
+
<li>Workflow hardening sprint — map one painful workflow, one repeated failure, and one buyer proof review before wider rollout</li>
|
|
935
|
+
<li>Shared enforcement memory — a shared lesson database where one developer's 👎 on a bad migration protects every agent on the team</li>
|
|
936
|
+
<li>Org dashboard — active agents, gate hit rates, risk agents, and proof-backed team metrics in one place</li>
|
|
937
|
+
<li>Hosted review views — constrained cards, lists, and callouts for rollout, incident, and audit visibility</li>
|
|
938
|
+
<li>Gate template library — pre-built guardrails for force-pushes, skipped tests, destructive SQL, and evidence-before-done</li>
|
|
939
|
+
<li>Docker Sandboxes guidance — route risky local autonomy into an isolated microVM-backed lane instead of running it directly on a shared host</li>
|
|
940
|
+
<li>Signed hosted sandbox dispatch — isolated execution path for team automations that do not need repo-bound local access</li>
|
|
941
|
+
<li>Release confidence story — Changesets, SemVer, version sync, and verification evidence keep publishes and rollout claims inspectable</li>
|
|
942
|
+
<li>Proof pack — attach verification evidence and rollout diagnostics so the buyer does not have to trust a demo</li>
|
|
943
|
+
</ul>
|
|
944
|
+
<a href="#workflow-sprint-intake" class="btn-team">Start Workflow Hardening Sprint</a>
|
|
945
|
+
<p style="font-size:11px;color:#666;margin-top:8px;">Team pricing anchors at $99/seat/mo with a 3-seat minimum after qualification. The first step is a 30-minute intake around one real blocker.</p>
|
|
946
|
+
</div>
|
|
947
|
+
</div>
|
|
948
|
+
</div>
|
|
949
|
+
</section>
|
|
950
|
+
|
|
951
|
+
<section class="compatibility" id="workflow-sprint-intake">
|
|
952
|
+
<div class="container">
|
|
953
|
+
<div class="section-label">Team Pilot</div>
|
|
954
|
+
<h2 class="section-title">Start with one repo, one workflow, one repeat failure</h2>
|
|
955
|
+
<p style="color:var(--text-dim);max-width:720px;margin:0 auto 16px;">This is the fastest path to first paid value for teams. Start with one workflow, one owner, and one blocker. The intake is designed to prove that ThumbGate reduces review churn, rollout risk, or repeated agent mistakes before a wider rollout.</p>
|
|
956
|
+
<form class="team-form" action="/v1/intake/workflow-sprint" method="POST">
|
|
957
|
+
<input type="hidden" name="ctaId" value="workflow_sprint_intake">
|
|
958
|
+
<input type="hidden" name="ctaPlacement" value="team_pricing">
|
|
959
|
+
<input type="hidden" name="planId" value="team">
|
|
960
|
+
<input type="email" name="email" placeholder="you@company.com" required>
|
|
961
|
+
<input type="text" name="company" placeholder="Company">
|
|
962
|
+
<input type="text" name="workflow" placeholder="Workflow to harden (e.g. deploy approvals, migrations, PR review)" required>
|
|
963
|
+
<input type="text" name="owner" placeholder="Workflow owner" required>
|
|
964
|
+
<input type="text" name="runtime" placeholder="Current agent/runtime (Claude Code, Codex, Cursor, Gemini...)" required>
|
|
965
|
+
<textarea class="full" name="blocker" placeholder="What repeat mistake, rollout blocker, or team handoff failure keeps happening?" required></textarea>
|
|
966
|
+
<textarea class="full" name="note" placeholder="Optional context: team size, repos involved, target rollout date, or what you need to prove internally."></textarea>
|
|
967
|
+
<div class="full">
|
|
968
|
+
<button type="submit" class="btn-team">Start Team Pilot Intake</button>
|
|
969
|
+
</div>
|
|
970
|
+
</form>
|
|
971
|
+
</div>
|
|
972
|
+
</section>
|
|
973
|
+
|
|
974
|
+
<!-- FAQ -->
|
|
975
|
+
<section class="faq" id="faq">
|
|
976
|
+
<div class="container">
|
|
977
|
+
<div class="section-label">FAQ</div>
|
|
978
|
+
<h2 class="section-title">Common questions</h2>
|
|
979
|
+
<div class="faq-list">
|
|
980
|
+
<div class="faq-item open">
|
|
981
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="true" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">Does ThumbGate support model fine-tuning?</div>
|
|
982
|
+
<div class="faq-a">Yes. ThumbGate Pro includes a Model Hardening Advisor and LoRA JSONL export. Pro users can export their episodic memory as DPO (Direct Preference Optimization) pairs to fine-tune local models (like Llama 3 or Mistral) so they natively avoid repeating known mistakes.</div>
|
|
983
|
+
</div>
|
|
984
|
+
<div class="faq-item">
|
|
985
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">How is ThumbGate different from model-training feedback loops?</div>
|
|
986
|
+
<div class="faq-a">ThumbGate's intelligence is context, not weights. It doesn't touch the model — it injects past feedback into context so your agent is conditioned by your corrections. Think of it as a behavioral immune system, not a training pipeline. The gate blocks are hard enforcement, not soft suggestions.</div>
|
|
987
|
+
</div>
|
|
988
|
+
<div class="faq-item">
|
|
989
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">What's the tech stack?</div>
|
|
990
|
+
<div class="faq-a">SQLite+FTS5 lesson DB for fast full-text search. MemAlign-inspired dual recall (principle-based rules + episodic context). Thompson Sampling for adaptive gate sensitivity per failure domain. LanceDB + Apache Arrow for local vector search with Hugging Face embeddings. ContextFS for context assembly. Bayesian belief updates on each memory. PreToolUse hook enforcement blocks known-bad actions before execution. All local-first — no cloud required.</div>
|
|
991
|
+
</div>
|
|
992
|
+
<div class="faq-item">
|
|
993
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">What AI agents and editors does this work with?</div>
|
|
994
|
+
<div class="faq-a">ThumbGate works with Claude Code, Cursor, Codex, Gemini CLI, Amp, OpenCode, and any other MCP-compatible agent. Cursor ships with a plugin bundle in this repo. Codex now ships both a standalone plugin bundle and a repo-local app plugin profile, and the published download is linked directly from this page. VS Code works when you run an MCP-compatible agent inside it, but this repo does not ship a standalone VS Code extension today.</div>
|
|
995
|
+
</div>
|
|
996
|
+
<div class="faq-item">
|
|
997
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">Do I have to chat inside the ThumbGate GPT for enforcement?</div>
|
|
998
|
+
<div class="faq-a">No. The ThumbGate GPT is the ChatGPT entrypoint for checking proposed actions, capturing thumbs-up/down lessons, and getting setup help. Use it for advice and checkpointing; hard enforcement still runs locally where the agent executes after <code>npx thumbgate init</code>.</div>
|
|
999
|
+
</div>
|
|
1000
|
+
<div class="faq-item">
|
|
1001
|
+
<button class="faq-q" type="button" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">How do we keep high-risk autonomous runs off the host?</button>
|
|
1002
|
+
<div class="faq-a">ThumbGate is the control plane, not just a prompt layer. Workflow Sentinel predicts blast radius before execution, and risky local autonomy can be routed into Docker Sandboxes instead of running directly on the host. Team workflows also have a signed hosted sandbox lane for isolated dispatch when local repo access is not required.</div>
|
|
1003
|
+
</div>
|
|
1004
|
+
<div class="faq-item">
|
|
1005
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">How do we trust a new package release?</div>
|
|
1006
|
+
<div class="faq-a">ThumbGate does not rely on vibes. Release-relevant PRs need a Changeset, SemVer rules keep version bumps honest, sync checks keep manifests aligned, proof lanes run before merge, and the exact main-branch merge commit is verified before the work is called done.</div>
|
|
1007
|
+
</div>
|
|
1008
|
+
<div class="faq-item">
|
|
1009
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">Do I need a cloud account?</div>
|
|
1010
|
+
<div class="faq-a">No. Free keeps local enforcement on your machine with 3 daily feedback captures, 5 lesson searches, unlimited recall, gates, and hook blocking. No cloud account is required. The business starts when a team wants shared rules, approval boundaries, hosted review views, org dashboard visibility, and proof that survives handoffs. Pro is the optional solo side lane for a personal dashboard and DPO export.</div>
|
|
1011
|
+
</div>
|
|
1012
|
+
<div class="faq-item">
|
|
1013
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">What if my thumbs-down is vague?</div>
|
|
1014
|
+
<div class="faq-a">For the current Claude auto-capture hook, ThumbGate can reuse up to 8 prior recorded entries and the failed tool call for a vague thumbs-down, then keep a linked 60-second feedback session open for later clarification. The timer resets when more context arrives, so the lesson stays attached to one feedback record instead of fragmenting into duplicates.</div>
|
|
1015
|
+
</div>
|
|
1016
|
+
<div class="faq-item">
|
|
1017
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">How are pre-action gates different from prompt rules?</div>
|
|
1018
|
+
<div class="faq-a">Prompt rules are suggestions that agents can ignore. Pre-Action Gates are enforcement — they block the action before execution. Gates are auto-generated from your human-in-the-loop feedback and use Thompson Sampling to adapt over time.</div>
|
|
1019
|
+
</div>
|
|
1020
|
+
<div class="faq-item">
|
|
1021
|
+
<div class="faq-q" role="button" tabindex="0" aria-expanded="false" onclick="toggleFaq(this)" onkeydown="handleFaqKeydown(event)">What does Pro cost?</div>
|
|
1022
|
+
<div class="faq-a">Pro is $19/mo or $149/yr (save 35%) for individual operators. Team pricing anchors at $99/seat/mo with a 3-seat minimum, and team buyers start with the workflow sprint intake instead of a blind org-wide rollout.</div>
|
|
1023
|
+
</div>
|
|
1024
|
+
</div>
|
|
1025
|
+
</div>
|
|
1026
|
+
</section>
|
|
1027
|
+
|
|
1028
|
+
<!-- NEWSLETTER SIGNUP -->
|
|
1029
|
+
<section class="compatibility" id="newsletter" style="padding: 48px 0;">
|
|
1030
|
+
<div class="container" style="text-align: center;">
|
|
1031
|
+
<div class="section-label">Buyer Follow-Up</div>
|
|
1032
|
+
<h2 class="section-title" style="margin-bottom: 16px;">Not ready to buy today? Keep the sprint brief, demo, and discovery notes one click away.</h2>
|
|
1033
|
+
<p style="color: var(--text-dim); margin-bottom: 24px; max-width: 560px; margin-left: auto; margin-right: auto;">Save your work email for the workflow sprint brief, new gate patterns, and buyer-facing proof updates. If you later choose the solo Pro checkout, we keep that path prefilled on this device too.</p>
|
|
1034
|
+
<form action="/api/newsletter" method="POST" data-newsletter-form data-page="homepage" data-intent="buyer_follow_up" style="display: flex; gap: 8px; max-width: 480px; margin: 0 auto; flex-wrap: wrap; justify-content: center;">
|
|
1035
|
+
<input type="email" name="email" data-buyer-email placeholder="you@company.com" required style="flex: 1; min-width: 220px; padding: 12px 16px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-raised); color: var(--text); font-size: 15px;">
|
|
1036
|
+
<button type="submit" style="padding: 12px 24px; background: var(--cyan); color: #000; border: none; border-radius: 8px; font-weight: 600; font-size: 15px; cursor: pointer;">Get sprint brief + updates</button>
|
|
1037
|
+
</form>
|
|
1038
|
+
<p data-newsletter-status style="min-height:20px;font-size:12px;color:var(--text-dim);margin-top:10px;" aria-live="polite"></p>
|
|
1039
|
+
</div>
|
|
1040
|
+
</section>
|
|
1041
|
+
|
|
1042
|
+
<!-- FINAL CTA -->
|
|
1043
|
+
<section class="final-cta">
|
|
1044
|
+
<div class="container">
|
|
1045
|
+
<h2>Stop the same mistake before it runs again.</h2>
|
|
1046
|
+
<p>Install free. No credit card. No signup. Hit your first gate in 60 seconds. Upgrade to Pro when you need the dashboard and exports.</p>
|
|
1047
|
+
<div style="display:flex;gap:12px;justify-content:center;flex-wrap:wrap;align-items:center;">
|
|
1048
|
+
<div class="hero-install" onclick="copyInstall(this)" title="Click to copy" style="margin-bottom:0;font-size:16px;padding:14px 24px;border:2px solid var(--cyan);">
|
|
1049
|
+
<span class="prompt">$</span>
|
|
1050
|
+
<span class="cmd">npx thumbgate init</span>
|
|
1051
|
+
<span class="copy-hint">click to copy</span>
|
|
1052
|
+
</div>
|
|
1053
|
+
<a href="/go/install?utm_source=website&utm_medium=homepage_final&utm_campaign=install_free&cta_id=final_install_cli&cta_placement=final_cta" onclick="posthog.capture('final_install_click',{cta:'install_cli'})" class="btn-pro btn-install-link" style="padding:12px 32px;font-size:15px;">Install Free CLI</a>
|
|
1054
|
+
<a href="/go/pro?utm_source=website&utm_medium=final_cta&utm_campaign=pro_upgrade&cta_id=final_go_pro&cta_placement=final_cta&plan_id=pro&landing_path=%2F" onclick="posthog.capture('final_pro_click',{cta:'go_pro'})" class="btn-pro" style="padding:10px 24px;font-size:13px;opacity:0.85;">Upgrade to Pro — $19/mo</a>
|
|
1055
|
+
<a href="#workflow-sprint-intake" class="btn-team" style="background:var(--green);">Start Workflow Hardening Sprint</a>
|
|
1056
|
+
</div>
|
|
1057
|
+
</div>
|
|
1058
|
+
</section>
|
|
1059
|
+
|
|
1060
|
+
<!-- FOOTER -->
|
|
1061
|
+
<footer>
|
|
1062
|
+
<div class="container">
|
|
1063
|
+
<div class="footer-links">
|
|
1064
|
+
<a href="https://github.com/IgorGanapolsky/ThumbGate" target="_blank" rel="noopener">GitHub</a>
|
|
1065
|
+
<a href="https://www.npmjs.com/package/thumbgate" target="_blank" rel="noopener">npm</a>
|
|
1066
|
+
<a href="https://www.producthunt.com/products/thumbgate" target="_blank" rel="noopener">Product Hunt</a>
|
|
1067
|
+
<a href="https://x.com/IgorGanapolsky" target="_blank" rel="noopener">X / Twitter</a>
|
|
1068
|
+
<a href="https://www.linkedin.com/in/igorganapolsky" target="_blank" rel="noopener">LinkedIn</a>
|
|
1069
|
+
<a href="/blog">Blog</a>
|
|
1070
|
+
</div>
|
|
1071
|
+
<span class="footer-copy">© 2026 Max Smith KDP LLC · MIT License · v1.4.6</span>
|
|
1072
|
+
</div>
|
|
1073
|
+
</footer>
|
|
1074
|
+
|
|
1075
|
+
<!-- STICKY BOTTOM CTA -->
|
|
1076
|
+
<div class="sticky-cta" id="sticky-cta">
|
|
1077
|
+
<span class="sticky-cta-text"><strong>npx thumbgate init</strong> — free CLI, zero friction</span>
|
|
1078
|
+
<div class="hero-install" onclick="copyInstall(this)" title="Click to copy" style="margin-bottom:0;padding:8px 16px;font-size:13px;">
|
|
1079
|
+
<span class="prompt">$</span>
|
|
1080
|
+
<span class="cmd">npx thumbgate init</span>
|
|
1081
|
+
<span class="copy-hint">copy</span>
|
|
1082
|
+
</div>
|
|
1083
|
+
<a href="/go/pro?utm_source=website&utm_medium=sticky_cta&utm_campaign=pro_upgrade&cta_id=sticky_go_pro&cta_placement=sticky_cta&plan_id=pro&landing_path=%2F" onclick="posthog.capture('sticky_pro_click',{cta:'go_pro'})" class="btn-pro" style="padding:8px 16px;font-size:12px;border-radius:6px;white-space:nowrap;">Go Pro — $19/mo</a>
|
|
1084
|
+
</div>
|
|
1085
|
+
<script>
|
|
1086
|
+
(function() {
|
|
1087
|
+
var stickyCta = document.getElementById('sticky-cta');
|
|
1088
|
+
var heroSection = document.querySelector('.hero');
|
|
1089
|
+
if (!stickyCta || !heroSection) return;
|
|
1090
|
+
var observer = new IntersectionObserver(function(entries) {
|
|
1091
|
+
entries.forEach(function(entry) {
|
|
1092
|
+
if (entry.isIntersecting) {
|
|
1093
|
+
stickyCta.classList.remove('visible');
|
|
1094
|
+
} else {
|
|
1095
|
+
stickyCta.classList.add('visible');
|
|
1096
|
+
}
|
|
1097
|
+
});
|
|
1098
|
+
}, { threshold: 0 });
|
|
1099
|
+
observer.observe(heroSection);
|
|
1100
|
+
})();
|
|
1101
|
+
</script>
|
|
1102
|
+
|
|
1103
|
+
<script src="/js/buyer-intent.js"></script>
|
|
1104
|
+
<script>
|
|
1105
|
+
function initializeBuyerIntentForms() {
|
|
1106
|
+
globalThis.ThumbGateBuyerIntent.initializeBuyerIntent({
|
|
1107
|
+
page: 'homepage',
|
|
1108
|
+
duplicateMessage: 'You are already on the list. Checkout on this device is now prefilled.',
|
|
1109
|
+
successMessage: 'Saved. We will keep checkout prefilled on this device.',
|
|
1110
|
+
});
|
|
1111
|
+
}
|
|
1112
|
+
|
|
1113
|
+
function readMarketingParam(name) {
|
|
1114
|
+
try {
|
|
1115
|
+
return new URLSearchParams(globalThis.location.search).get(name);
|
|
1116
|
+
} catch (_err) {
|
|
1117
|
+
return null;
|
|
1118
|
+
}
|
|
1119
|
+
}
|
|
1120
|
+
|
|
1121
|
+
function sendFirstPartyTelemetry(eventType, props) {
|
|
1122
|
+
var payload = Object.assign({
|
|
1123
|
+
eventType: eventType,
|
|
1124
|
+
clientType: 'web',
|
|
1125
|
+
page: globalThis.location.pathname || '/',
|
|
1126
|
+
landingPath: globalThis.location.pathname || '/',
|
|
1127
|
+
acquisitionId: serverAcquisitionId,
|
|
1128
|
+
visitorId: serverVisitorId,
|
|
1129
|
+
sessionId: serverSessionId,
|
|
1130
|
+
source: readMarketingParam('utm_source') || readMarketingParam('source') || 'website',
|
|
1131
|
+
utmSource: readMarketingParam('utm_source') || 'website',
|
|
1132
|
+
utmMedium: readMarketingParam('utm_medium') || 'landing_page',
|
|
1133
|
+
utmCampaign: readMarketingParam('utm_campaign') || 'organic',
|
|
1134
|
+
utmContent: readMarketingParam('utm_content'),
|
|
1135
|
+
utmTerm: readMarketingParam('utm_term'),
|
|
1136
|
+
creator: readMarketingParam('creator') || readMarketingParam('creator_handle'),
|
|
1137
|
+
community: readMarketingParam('community') || readMarketingParam('subreddit'),
|
|
1138
|
+
postId: readMarketingParam('post_id'),
|
|
1139
|
+
commentId: readMarketingParam('comment_id'),
|
|
1140
|
+
campaignVariant: readMarketingParam('campaign_variant'),
|
|
1141
|
+
offerCode: readMarketingParam('offer_code'),
|
|
1142
|
+
}, props || {});
|
|
1143
|
+
var body = JSON.stringify(payload);
|
|
1144
|
+
if (navigator.sendBeacon) {
|
|
1145
|
+
navigator.sendBeacon('/v1/telemetry/ping', new Blob([body], { type: 'application/json' }));
|
|
1146
|
+
return;
|
|
1147
|
+
}
|
|
1148
|
+
fetch('/v1/telemetry/ping', {
|
|
1149
|
+
method: 'POST',
|
|
1150
|
+
headers: { 'Content-Type': 'application/json' },
|
|
1151
|
+
body: body,
|
|
1152
|
+
keepalive: true,
|
|
1153
|
+
}).catch(function() {});
|
|
1154
|
+
}
|
|
1155
|
+
|
|
1156
|
+
function resolvePricingClickTier(el) {
|
|
1157
|
+
if (el.classList.contains('btn-install-hero')) return 'install';
|
|
1158
|
+
if (el.classList.contains('btn-install-link')) return 'install';
|
|
1159
|
+
if (el.classList.contains('btn-gpt-page')) return 'chatgpt_gpt';
|
|
1160
|
+
if (el.classList.contains('btn-pro')) return 'pro';
|
|
1161
|
+
if (el.classList.contains('btn-pro-page')) return 'pro_page';
|
|
1162
|
+
if (el.classList.contains('btn-team')) return 'team';
|
|
1163
|
+
if (el.classList.contains('btn-free')) return 'free';
|
|
1164
|
+
if (el.classList.contains('btn-demo-link')) return 'demo';
|
|
1165
|
+
if (el.classList.contains('nav-cta')) return 'team';
|
|
1166
|
+
return 'nav';
|
|
1167
|
+
}
|
|
1168
|
+
|
|
1169
|
+
function copyInstall(el) {
|
|
1170
|
+
navigator.clipboard.writeText('npx thumbgate init').then(function() {
|
|
1171
|
+
var hint = el.querySelector('.copy-hint');
|
|
1172
|
+
hint.textContent = 'copied!';
|
|
1173
|
+
hint.classList.add('copied');
|
|
1174
|
+
setTimeout(function() { hint.textContent = 'click to copy'; hint.classList.remove('copied'); }, 2000);
|
|
1175
|
+
});
|
|
1176
|
+
if (typeof plausible === 'function') plausible('install_copy');
|
|
1177
|
+
sendFirstPartyTelemetry('install_copy', {
|
|
1178
|
+
ctaId: 'install_copy',
|
|
1179
|
+
ctaPlacement: 'copy_command',
|
|
1180
|
+
planId: 'free',
|
|
1181
|
+
});
|
|
1182
|
+
}
|
|
1183
|
+
|
|
1184
|
+
/* ── Plausible custom event tracking ── */
|
|
1185
|
+
(function() {
|
|
1186
|
+
function trackClick(selector, eventName, props) {
|
|
1187
|
+
document.querySelectorAll(selector).forEach(function(el) {
|
|
1188
|
+
el.addEventListener('click', function() {
|
|
1189
|
+
if (typeof plausible === 'function') plausible(eventName, { props: props || {} });
|
|
1190
|
+
var section = el.closest('section');
|
|
1191
|
+
var sectionId = section ? (section.id || String(section.className || '').split(' ')[0] || 'unknown') : 'unknown';
|
|
1192
|
+
var firstPartyEventName = eventName === 'checkout_start' ? 'cta_click' : eventName;
|
|
1193
|
+
sendFirstPartyTelemetry(firstPartyEventName, Object.assign({}, props || {}, {
|
|
1194
|
+
ctaId: (props && (props.ctaId || props.cta)) || eventName,
|
|
1195
|
+
ctaPlacement: (props && props.ctaPlacement) || sectionId,
|
|
1196
|
+
planId: (props && props.planId) || (props && props.tier) || null,
|
|
1197
|
+
}));
|
|
1198
|
+
});
|
|
1199
|
+
});
|
|
1200
|
+
}
|
|
1201
|
+
|
|
1202
|
+
function toggleFaq(el) {
|
|
1203
|
+
var item = el.parentElement;
|
|
1204
|
+
var open = item.classList.toggle('open');
|
|
1205
|
+
el.setAttribute('aria-expanded', open ? 'true' : 'false');
|
|
1206
|
+
}
|
|
1207
|
+
|
|
1208
|
+
function handleFaqKeydown(event) {
|
|
1209
|
+
if (event.key !== 'Enter' && event.key !== ' ') return;
|
|
1210
|
+
event.preventDefault();
|
|
1211
|
+
toggleFaq(event.currentTarget);
|
|
1212
|
+
}
|
|
1213
|
+
|
|
1214
|
+
/* CTA clicks */
|
|
1215
|
+
trackClick('.btn-pro', 'checkout_start', { tier: 'pro', price: 19, billing: 'monthly' });
|
|
1216
|
+
trackClick('.btn-gpt-page:not(.btn-install-hero)', 'chatgpt_gpt_click', { tier: 'free', source: 'homepage_gpt' });
|
|
1217
|
+
trackClick('.btn-install-hero', 'install_guide_click', { tier: 'free', source: 'hero_install' });
|
|
1218
|
+
trackClick('.btn-pro-page:not(.btn-install-link)', 'pro_page_click', { tier: 'pro', source: 'hero' });
|
|
1219
|
+
trackClick('.btn-install-link', 'install_guide_click', { tier: 'free', source: 'homepage_cta' });
|
|
1220
|
+
trackClick('.btn-team', 'workflow_sprint_intake_click', { tier: 'team', offer: 'workflow_hardening_sprint' });
|
|
1221
|
+
trackClick('.btn-free', 'install_click', { tier: 'free' });
|
|
1222
|
+
trackClick('.btn-demo-link', 'demo_click', { source: 'homepage' });
|
|
1223
|
+
trackClick('.nav-cta', 'chatgpt_gpt_click', { tier: 'free', source: 'nav' });
|
|
1224
|
+
|
|
1225
|
+
/* Pricing CTA conversion tracking — fires on every Get Started / Pro / Team button click
|
|
1226
|
+
with section context so we can distinguish pricing section vs final CTA section clicks */
|
|
1227
|
+
document.querySelectorAll('.btn-pro, .btn-gpt-page, .btn-pro-page, .btn-install-hero, .btn-install-link, .btn-team, .btn-free, .btn-demo-link, .nav-cta').forEach(function(el) {
|
|
1228
|
+
el.addEventListener('click', function() {
|
|
1229
|
+
var section = el.closest('section');
|
|
1230
|
+
var sectionId = section ? (section.id || section.className.split(' ')[0] || 'unknown') : 'unknown';
|
|
1231
|
+
var tier = resolvePricingClickTier(el);
|
|
1232
|
+
var label = (el.textContent || '').trim().substring(0, 40);
|
|
1233
|
+
if (typeof plausible === 'function') {
|
|
1234
|
+
plausible('pricing_cta_click', { props: { tier: tier, section: sectionId, label: label } });
|
|
1235
|
+
}
|
|
1236
|
+
});
|
|
1237
|
+
});
|
|
1238
|
+
|
|
1239
|
+
/* FAQ accordion opens */
|
|
1240
|
+
document.querySelectorAll('.faq-q').forEach(function(el) {
|
|
1241
|
+
el.addEventListener('click', function() {
|
|
1242
|
+
var question = this.textContent.trim().substring(0, 60);
|
|
1243
|
+
if (typeof plausible === 'function') plausible('faq_open', { props: { question: question } });
|
|
1244
|
+
});
|
|
1245
|
+
});
|
|
1246
|
+
|
|
1247
|
+
/* Scroll depth (25%, 50%, 75%, 100%) */
|
|
1248
|
+
var scrollMarks = { 25: false, 50: false, 75: false, 100: false };
|
|
1249
|
+
window.addEventListener('scroll', function() {
|
|
1250
|
+
var docHeight = document.documentElement.scrollHeight - window.innerHeight;
|
|
1251
|
+
if (docHeight <= 0) return;
|
|
1252
|
+
var pct = Math.round((window.scrollY / docHeight) * 100);
|
|
1253
|
+
[25, 50, 75, 100].forEach(function(mark) {
|
|
1254
|
+
if (pct >= mark && !scrollMarks[mark]) {
|
|
1255
|
+
scrollMarks[mark] = true;
|
|
1256
|
+
if (typeof plausible === 'function') plausible('scroll_depth', { props: { depth: mark + '%' } });
|
|
1257
|
+
}
|
|
1258
|
+
});
|
|
1259
|
+
});
|
|
1260
|
+
|
|
1261
|
+
/* Proof bar link clicks */
|
|
1262
|
+
trackClick('.proof-bar a', 'proof_bar_click');
|
|
1263
|
+
|
|
1264
|
+
/* Compatibility card clicks */
|
|
1265
|
+
trackClick('.compat-card', 'compat_click');
|
|
1266
|
+
|
|
1267
|
+
/* SEO/comparison page clicks */
|
|
1268
|
+
trackClick('.seo-card', 'seo_page_click');
|
|
1269
|
+
})();
|
|
1270
|
+
</script>
|
|
1271
|
+
<script>
|
|
1272
|
+
initializeBuyerIntentForms();
|
|
1273
|
+
|
|
1274
|
+
async function handleProTrial() {
|
|
1275
|
+
var buyerIntent = globalThis.ThumbGateBuyerIntent;
|
|
1276
|
+
var email = document.getElementById('pro-email');
|
|
1277
|
+
var normalizedEmail = buyerIntent.normalizeBuyerEmail(email && email.value);
|
|
1278
|
+
if (!email || !buyerIntent.isValidBuyerEmail(normalizedEmail)) {
|
|
1279
|
+
email.style.border = '2px solid #f87171';
|
|
1280
|
+
email.placeholder = 'Please enter a valid email';
|
|
1281
|
+
email.focus();
|
|
1282
|
+
return;
|
|
1283
|
+
}
|
|
1284
|
+
email.style.border = '1px solid #333';
|
|
1285
|
+
buyerIntent.storeBuyerEmail(normalizedEmail);
|
|
1286
|
+
buyerIntent.hydrateBuyerEmailInputs(normalizedEmail);
|
|
1287
|
+
buyerIntent.applyBuyerEmailToCheckoutLinks(normalizedEmail);
|
|
1288
|
+
var checkoutLink = document.getElementById('pro-checkout-link');
|
|
1289
|
+
var checkoutUrl = checkoutLink ? checkoutLink.href : '/checkout/pro';
|
|
1290
|
+
if (typeof plausible === 'function') {
|
|
1291
|
+
plausible('trial_email_captured', { props: { page: 'homepage', intent: 'checkout' } });
|
|
1292
|
+
}
|
|
1293
|
+
try {
|
|
1294
|
+
await buyerIntent.submitNewsletterSignup(normalizedEmail);
|
|
1295
|
+
} catch (_err) {
|
|
1296
|
+
// Continue to checkout even if lead capture fails.
|
|
1297
|
+
}
|
|
1298
|
+
globalThis.location.assign(checkoutUrl);
|
|
1299
|
+
}
|
|
1300
|
+
</script>
|
|
1301
|
+
</body>
|
|
1302
|
+
</html>
|