Landing page: a "Headless browser" feature card (#1786)

Co-authored-by: Claude Opus 5 <noreply@anthropic.com>

Author: suleimansh

packages/the-framework.ai/pages/index/Features.LOGIC.md

@@ -1,4 +1,4 @@
-The "Features" chapter: eight cards, each a feature the site claims, with a one-sentence explanation. None of the cards is marked "Coming soon".
+The "Features" chapter: nine cards, each a feature the site claims, with a one-sentence explanation. None of the cards is marked "Coming soon".
 
 ## Glossary
 
@@ -11,6 +11,7 @@ The "Features" chapter: eight cards, each a feature the site claims, with a one-
 - **"Optimal quota usage"** - The Framework drives AI autonomy so that unused quota [2] stops going to waste: maximum daily usage while keeping enough quota space for manual prompts.
 - **"Bring your own prompts"** - favorite prompts can be saved and quickly re-used, shared with teammates or kept personal.
 - **"Dashboard"** - shows the pro-rata usage quota, the current AI agents, the queued AI tasks, the queue of required reviews, "hot" tickets, and more.
+- **"Headless browser"** - The Framework launches a headless Chromium that agents [1] fully control (DOM, console, network and screenshots via Chrome MCP), with no AI browser extension needed; the user can watch it live and take over on login walls.
 - **"Notifications"** - browser and/or Discord notifications when AI is finished or needs the user.
 - **"Claude Code Web"** - agents can be orchestrated through Claude Code Web for 0% local CPU usage.
 - **"Swarm of local computers"** - agents can be orchestrated across multiple local computers.

packages/the-framework.ai/pages/index/Features.tsx

@@ -50,6 +50,13 @@ export function Features() {
             more.
           </FeatureText>
         </div>
+        <div style={{ ...featureCardStyle, gap: 12 }}>
+          <h3 style={{ margin: 0, fontSize: 19, fontWeight: 600 }}>Headless browser</h3>
+          <FeatureText>
+            The Framework launches a headless Chromium that agents fully control — DOM, console, network and
+            screenshots via Chrome MCP. No AI browser extension needed. Watch it live and take over on login walls.
+          </FeatureText>
+        </div>
         <div style={{ ...featureCardStyle, gap: 12 }}>
           <h3 style={{ margin: 0, fontSize: 19, fontWeight: 600 }}>Notifications</h3>
           <FeatureText>Get browser and/or Discord notifications when AI is finished or needs you.</FeatureText>

packages/the-framework.ai/pages/index/LOGIC.md

@@ -18,7 +18,7 @@ The landing page of https://the-framework.ai and the pieces every page of the si
 - **The problem** (`StopBabysitting.tsx`) - the site's core argument: five ways a coding agent [1] lets its user down, the bad fix people try, and The Framework's solution for each.
 - **What runs without a human** (`AutonomousAi.tsx`) - the claims about what AI does on its own under The Framework, followed by the reassurances that bound them.
 - **The two building blocks** (`HowItWorks.tsx`, `EnhancedSystemPrompt.tsx`, `Queues.tsx`, `Prompts.tsx`) - the enhanced system prompt and the queues, side by side, closed by the note that the prompts are open source and can be replaced with the visitor's own.
-- **The features** (`Features.tsx`) - eight cards, each a claim with a one-sentence explanation, marked "Coming soon" where the feature is not shipped.
+- **The features** (`Features.tsx`) - nine cards, each a claim with a one-sentence explanation, from bringing your own subscription to a headless browser the agents control; none is marked "Coming soon".
 - **What the visitor keeps** (`YourFramework.tsx`) - the promises that it is the visitor's framework: only the features they pick, and nothing forced.
 - **The invitation** (`Cta.tsx`, `TopNav.tsx`, `Footer.tsx`) - the closing call to join the Discord server or star the repository, and the navigation and footer that carry the same three addresses on every page of the site.
 - **The shared vocabulary** (`ui.tsx`, `icons.tsx`, `copy.ts`) - the visual pieces the sections are drawn from and the three addresses the whole site links to, the Discord, GitHub and npm logos, and the click-to-copy behavior behind every command chip and the hero's "Try:" box.