ai-agent

crawl4ai-frontend

Name: crawl4ai-frontend
Author: f4ww4z

A frontend for crawl4ai

87 stars25 forksHTMLUpdated 12/5/2024100% free · open source

What it does

Provides a web UI to run Crawl4AI extractions without writing code.

When to use it

•You need to quickly prototype content extraction for a website and prefer a graphical interface.
•Your team wants to let non‑developers test different selectors and extraction prompts.
•You want to demo Crawl4AI results to investors or clients in real time.

Ready-to-paste prompt

In the UI, enter `https://news.ycombinator.com/` as the URL, set **Prompt** to `Extract the title, author, and score of each story as JSON`, and press **Extract** – the result panel will show a structured JSON list of stories.

Heads up: The frontend will only work if a Crawl4AI backend is already running and reachable; without setting `VITE_BACKEND_URL` to a live backend, the UI will return 502 errors.

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

⚡ Runs out of the box

A prompt/skill package — nothing to install beyond adding it to your AI tool.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/crawl4ai-frontend && curl -fsSL https://workflowstacks.com/api/skills/crawl4ai-frontend/claude-skill -o ~/.claude/skills/crawl4ai-frontend/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

How crawl4ai-frontend works

Codeflow

Free to inspect

Crawl4ai-frontend is mostly documents (43 doc files, 1 small script) — something you read, not something you run. There is nothing to install. Last commit 23 months ago, MIT license.

Size

Mostly documents

43 documents · 1 small script · 52 min skim

Setup

Nothing to install

A guide / curated list. Just read it and follow the links.

Runs on

Nowhere — you read it

A reading resource, not a program.

HTML 56%Python 39%Dockerfile 5%

Where to start reading

1
README.md
Start here — what it does and how to install it

What's in each folder

docs/Documentation42 files

.vscode/Editor / agent settings1 files

static/Images & static assets1 files

READMEDocumentedDocker readyMIT licenseLast update 23 mo ago

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

⚡ Runs out of the box

A prompt/skill package — nothing to install beyond adding it to your AI tool.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/crawl4ai-frontend && curl -fsSL https://workflowstacks.com/api/skills/crawl4ai-frontend/claude-skill -o ~/.claude/skills/crawl4ai-frontend/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

f4ww4z

Language

HTML