Tools für Frontend

Behavior guidelines drawn from Karpathy's observations of how LLMs go wrong when coding: think before acting, keep it simple, make surgical changes only, and drive work by verifiable goals. Can also be used directly as a CLAUDE.md.

Four guidelines based on Karpathy's observations of common LLM coding mistakes: think before coding, prefer simplicity, make only necessary changes, and work toward verifiable goals. Ships as a plugin skill or works as a CLAUDE.md. Community-made, not by Karpathy.

Open-source terminal coding agent that switches freely between model providers. Includes a build agent that edits code, a read-only plan agent for analysis, subagents, and a desktop app. Formerly sst/opencode.

Builds multi-component web pages that need state or routing with React, Tailwind CSS and shadcn/ui, using bundled init and build scripts, then packs them into a single HTML file for a claude.ai Artifact. Official Anthropic skill.

Drives local web apps with Python Playwright scripts to verify features, debug the UI, take screenshots and read browser logs. Includes helper scripts to start and stop dev servers. Official Anthropic skill.

Has the agent follow a 'don't write it if you can avoid it' ladder: ask if it's needed, then reuse existing code, the standard library, platform features and installed dependencies, writing only the minimum while keeping validation, error handling, security and accessibility.

'Laziest senior engineer' mode: checks whether the work is needed and whether existing code, the standard library or platform features cover it, then writes the minimum code while keeping validation, error handling and security. For Claude Code and Codex; its hook needs Node.js.

Git commit commands: /commit writes messages in the repo's style, /commit-push-pr branches, commits, pushes and opens a PR in one step (needs the gh CLI), and /clean_gone removes local branches deleted on the remote. Official Anthropic plugin.

A seven-phase feature development workflow: clarify requirements, explore the codebase with parallel subagents, design the architecture, implement, then run a quality review. Start it with /feature-dev. Official Anthropic plugin.

Generates hook rules from a one-line description or by analyzing recent conversations. Rules are Markdown files with match conditions that block or warn on dangerous commands and unwanted patterns, and take effect without a restart. Official Anthropic plugin.

Six specialized review subagents that check comment accuracy, test coverage, silent failures, type design, code style and simplification opportunities. Run them individually or all at once. Official Anthropic plugin.

After code changes, has the agent check routes, errors and page behavior in the running Next.js app via /_next/mcp and agent-browser to confirm the change really works. Maintained by Next.js; needs Next.js 16.3+ (Turbopack) and agent-browser.

Drives a Next.js route to instant navigation under Cache Components: writes a failing @next/playwright instant() e2e test, pushes Suspense boundaries down to grow the static shell until it passes, and keeps the test as a regression guard. Requires Next.js 16.3+ with cacheComponents.

Official Next.js plugin shipped in the vercel/next.js repo: guides enabling and tuning Cache Components and Partial Prefetching, and verifies changes on a running dev server with the Next.js MCP and agent-browser.

GitHub's official spec-driven development toolkit: the specify CLI sets up spec, plan and task workflows for Copilot, Claude Code, Codex and other agents so the spec comes before the code, plus bug-fix and idea-evaluation flows. Needs Python 3.11+ and uv.

UI/UX design knowledge base plugin with searchable UI styles, color palettes, font pairings, charts and guidelines for 20+ tech stacks; generates complete design system recommendations by product type. Needs Python 3 installed locally.

UI design knowledge base skill: looks up UI styles, palettes, font pairings, charts and UX guidelines by product type and generates a full design system, covering 22 stacks including React, SwiftUI and Flutter. Needs Python 3 locally.

Migrates React projects and shadcn components from Radix UI to Base UI, one component at a time or the whole project on request. Prefers the shadcn CLI's base variants merged with user customizations, typechecks every step, and writes a per-component report in .migration/. From the shadcn/ui repo.

Official shadcn/ui skill: uses the shadcn CLI to read project config and component docs, then adds, searches, composes and fixes components following styling, form and accessibility rules. Can also start new projects from presets.

Official shadcn/ui CLI: initializes projects and adds component source to your codebase on demand, with switchable presets. Since v4 it offers --dry-run and --diff so agents can preview changes, and it comes with an agent skill.

MCP server built into the official shadcn CLI: lets agents browse and search components, blocks and templates in any configured registry, including private ones, and install them into your project in plain language. The project needs a components.json.

Makes the agent answer in terse 'caveman' style to cut output tokens, compressing only prose while leaving code, commands and errors intact. Includes a local proxy that compresses logs, test output and other input. Works with Claude Code, Codex and 30+ other agents.

JavaScript, TypeScript and WebAssembly runtime with built-in formatting, linting, testing and compilation. Scripts get no file, network or environment access unless granted with --allow-* flags, making agent-generated scripts safer to run.

Google's official open-source terminal agent using Gemini models with a 1M-token context. Built-in Google Search, file and shell tools, plus MCP support. Personal Google accounts get a free quota.