Paste any URL. An AI agent scrapes the entire website, cross-references it against reviews, funding data, and news — then roasts their marketing BS out loud.
BYOK (Bring Your Own Keys) — you provide your own API keys. Nothing stored on our servers.
Built for ElevenHacks Hack #1: Firecrawl x ElevenLabs.
demo.mp4
| Landing | Analyzing |
|---|---|
 |
 |
| Roasting | Verdict |
|---|---|
 |
 |
| Landing | Analyzing |
|---|---|
 |
 |
| Roasting | Verdict |
|---|---|
 |
 |
- Enter your API keys — Anthropic, Firecrawl, and ElevenLabs (stored in your browser only)
- Paste a URL — any company website
- Hit "ROAST THIS SITE"
- Watch the AI research live — Claude autonomously scrapes pages, searches for reviews, funding data, news, and competitors
- Hear the roast — ElevenLabs TTS delivers a savage comedy roast out loud with a live retro terminal transcript
- Get the verdict — BS Score, one-liner, red flags, and social sharing
Your API keys are stored in your browser's localStorage and sent per-request over HTTPS. They are never persisted, logged, or stored on the server.
Browser (localStorage)
|
| Keys sent in POST body per request (HTTPS)
|
v
Next.js API Route
|
+-- /api/analyze
| |-- Creates Anthropic client with your key
| |-- Calls Firecrawl API with your key
| +-- Returns SSE stream of research events
|
+-- /api/speak
|-- Calls ElevenLabs TTS with your key
+-- Streams audio back to browser
Claude Sonnet 4.6 runs a multi-turn tool-use loop — it decides what to scrape, what to search for, and how to combine the data.
User submits URL + keys
|
Anthropic API (Claude Sonnet 4.6) receives the task
|
Claude calls tools autonomously (up to 10 turns):
-> scrape_url: reads landing page, /about, /pricing, /team, /blog
-> search_web: finds reviews, funding, news, competitors
|
Each tool call streams as an SSE event to the frontend
-> Research feed updates in real-time
|
Claude generates structured JSON:
-> Voice script (for TTS)
-> Verdict data (score, red flags, one-liner)
|
ElevenLabs TTS streams audio chunks via MediaSource API
|
Audio plays within ~200ms (no waiting for full generation)
|
Frontend syncs live terminal transcript with audio playback
Firecrawl powers the research capabilities through two tools:
-
scrape_url— Scrapes any URL and returns clean markdown. Claude uses this to read landing pages, about pages, pricing pages, team pages, and blogs. It extracts hero copy, pricing tiers, team size, blog activity, testimonials, and buzzword density. -
search_web— Searches the web and returns structured content from top results. Claude searches for reviews, Crunchbase funding data, recent news, competitor analysis, and social media presence.
Claude calls these tools autonomously in a multi-turn loop, reformulating queries if initial searches don't find what it needs.
ElevenLabs Text-to-Speech converts Claude's roast script into natural speech using the Adam voice (the viral AI narration voice) with the eleven_turbo_v2_5 model for consistent, stable audio output.
Audio is streamed in real-time using the MediaSource API — playback begins within ~200ms of the first chunk arriving. On Safari (which lacks MediaSource for audio/mpeg), the player falls back gracefully to blob-based playback.
The frontend syncs a live terminal-style transcript with the audio playback — green monospace text appearing character-by-character as the voice speaks, with source annotations (// SOURCE: BLOG -> Dead since Oct 2024) woven inline.
| Layer | Technology |
|---|---|
| Framework | Next.js 16 (App Router) |
| Styling | Tailwind CSS v4 |
| AI | Anthropic Claude Sonnet 4.6 (multi-turn tool-use loop) |
| Web Scraping | Firecrawl API (/scrape + /search) |
| Voice | ElevenLabs TTS API (Adam voice, turbo v2.5, streaming) |
| Real-time | Server-Sent Events (SSE) + MediaSource API |
| Key Storage | Browser localStorage (BYOK) |
| Design | 8-Bit Neo-Brutalist aesthetic |
| Video | Remotion (programmatic demo video generation) |
The UI follows an 8-Bit Neo-Brutalist / Retro Arcade Tech aesthetic:
- Typography:
Press Start 2P(chunky pixel font) for headings,Space Mono(monospace) for all body/UI text - Colors: Off-white
#F2F0EBbackground, stark black borders, electric blue#0055FFand bright orange#FF4400accents, terminal green#00FF66 - UI: 3px solid black borders, sharp 90-degree corners, zero border-radius, zero shadows
- Graphics: Pixel-art decorations,
[X]checkboxes,>_terminal carets,>>arrows, retro window dots - Dark mode:
#0C0C0Cbackground,#333333borders, same accent colors preserved
- Node.js 18+
- pnpm
You'll need keys from three services (all have free tiers):
| Service | Get your key at | Used for |
|---|---|---|
| Anthropic | console.anthropic.com | AI analysis (Claude Sonnet 4.6) |
| Firecrawl | firecrawl.dev | Web scraping and search |
| ElevenLabs | elevenlabs.io | Text-to-speech voice |
pnpm install
pnpm devOpen http://localhost:3000 — you'll be prompted to enter your API keys on first visit.
src/
app/
layout.tsx # Root layout, fonts (Press Start 2P + Space Mono)
page.tsx # Main page - key gating + 4-screen state machine
globals.css # Design tokens, light/dark themes
api/
analyze/route.ts # SSE endpoint - Claude tool-use loop + Firecrawl
speak/route.ts # ElevenLabs TTS streaming endpoint
components/
key-setup.tsx # BYOK key input screen
url-input.tsx # URL input + CTA
research-feed.tsx # Live research feed with [X] checkboxes
voice-player.tsx # Retro terminal transcript + audio player
verdict-card.tsx # Verdict card with BS Score
share-buttons.tsx # Social share actions
theme-toggle.tsx # Light/dark mode toggle
lib/
firecrawl-tools.ts # Firecrawl API functions + tool definitions
prompts.ts # Roast system prompt
types.ts # Shared TypeScript types
product-video/ # Remotion project for demo video generation
"Hundred fifty billion dollar market cap — and their tagline is 'Put AI to Work for People.' That's not a value proposition, that's a fortune cookie."
Every roast is backed by real data. The AI agent scrapes the actual website, searches for real reviews and funding data, then generates a savage comedy script referencing specific details — exact headlines, exact dates, exact numbers. No generic humor. Every punchline hits because it's true.
The roast prompt uses named comedy techniques: The Math Roast, The Time Roast, The Comparison Roast, The Funding Roast, The Copyright Roast. It escalates from devastating to career-ending and closes with a quotable one-liner that twists the company's own tagline.
- API keys are stored in your browser's
localStorageonly - Keys are sent per-request in the POST body over HTTPS
- The server never logs, persists, or stores your keys
- Keys exist in server memory only for the duration of each request
- Each request creates a fresh API client — no shared state
#ElevenHacks @elevenlabsio @firecrawl_dev
MIT