webconsulting-skills
Curated Agent Skills for AI-augmented software development — core installer for Cursor, Claude Code, Gemini CLI, Codex, and Windsurf; skills
Open source Open in the app JSON README (API)
About
Curated Agent Skills for AI-augmented software development — core installer for Cursor, Claude Code, Gemini CLI, Codex, and Windsurf; skills are linked as full directories with optional references, scripts, assets, and agent metadata
Details
- Kind
- Plugins
- Topic
- AI, RAG & memory
- Publisher
- dirnbauer
- Origin
- gemini
- Category
- ferramentas
- Version
- 2.0.0
- Stars
- 33
- Forks
- 6
- Last push
- 2026-07-27T06:21:27Z
- Repository state
- arquivado
- Language
- Shell
- License
- NOASSERTION
- Added
- 2026-08-30 14:13:39
- Updated
- 2026-08-30 14:13:39
- Origin id
dirnbauer/webconsulting-skills
README
# webconsulting Agent Skills
> ## 📦 This repository is archived
>
> **TYPO3 work has moved to [dirnbauer/typo3-skills](https://github.com/dirnbauer/typo3-skills)** — 26 owned + 11 vendored TYPO3 v14 skills with a measured eval harness and a single gate command. The TYPO3 updater there (`typo3-upgrade-run`) supersedes `typo3-14-update` in this repository: it proves the update changed nothing for visitors, with a sealed baseline, a determinism self-test, and a real exit-code contract.
>
> Everything here stays readable and installable — this repository is simply no longer updated. The ~105 non-TYPO3 skills (marketing, design, and general tooling) remain available at the state of the final commit.
> **TYPO3 skills:** Guidance here primarily targets **TYPO3 v14.x**. `typo3-translations` also covers TYPO3 13 compatibility where translation format choices affect upgrades. These skills **will change** as v14 evolves — **through and after** the v14 LTS release. Always verify third-party extensions on Packagist (`require.typo3/cms-core`) for your project.
A curated collection of **137 Agent Skills** from **webconsulting** for AI-augmented software development. Some skills are built in-house, others are carefully imported, adapted, and maintained from strong open-source foundations. Together they give your AI coding assistant a practical, production-focused toolkit for TYPO3, frontend work, security, legal compliance, video, documentation, and enterprise engineering.
> **Core installer:** Cursor, Claude Code, Gemini CLI, OpenAI Codex, and Windsurf. Other tools such as GitHub Copilot, Cline, Aider, and Kiro can be added with native instruction files or a manual skills-directory link.
> **Install script status:** The installer has been tested with Cursor, Claude Desktop, OpenAI Codex, and project-level mirrors for Gemini CLI and Windsurf.
### A Note from the Maintainer
This repository is meant to be useful on real projects: a technically solid collection of
agent skills from webconsulting that helps teams move faster without lowering engineering quality.
The goal is straightforward: one place for reusable skill knowledge that can be installed,
synced, and used across multiple AI coding clients.
Many of the TYPO3 and PHP skills in this collection build on the excellent open-source work by
**[Netresearch DTT GmbH](https://www.netresearch.de/)**. Their repositories have been an important
foundation for this collection, and their contribution to practical TYPO3 and PHP engineering
deserves clear credit. Thank you, Netresearch, and thank you as well to the engineers,
maintainers, and contributors behind that work. This collection is better because of the
care, clarity, and generosity you brought to the TYPO3 ecosystem.
Thank you also to **[ochorocho](https://github.com/ochorocho)** for the
[Camino: Camp Vienna "Lit it Up!"](https://dev.ochorocho.dev/camp-vienna#/) material and
[lit_demo](https://github.com/ochorocho/lit_demo) examples, which informed the practical
TYPO3 backend Lit guidance in the `typo3-webcomponents` skill.
## Skill Categories
This repository currently ships **138 top-level skills** (`skills/*/SKILL.md`) across **13 categories**.
Category-specific add-ons are not counted as top-level skills.
| Category | Skills | Description |
|----------|--------|-------------|
| **TYPO3 CMS** | 31 skills | Content Blocks (webconsulting), shadcn Content Elements (webconsulting), Desiderio Teach (Matt Pocock), Translations (webconsulting), Idea -> Extension -> Blog (webconsulting), News Tags (webconsulting), DataHandler (webconsulting), DDEV (Netresearch), Testing (Netresearch), Conformance (Netresearch), Docs (Netresearch), Core Contributions (Netresearch), Initial Release (webconsulting), Rector (webconsulting), Update (webconsulting), Extension Upgrade (Netresearch), Fractor (webconsulting), Icon14 (webconsulting), Security (webconsulting), SEO (webconsulting), Accessibility (webconsulting), WCAG 2.2 AA Agentic Accessibility (webconsulting), Simplify (Anthropic), Batch (webconsulting), Powermail (webconsulting), Records List Types (webconsulting), Workspaces (webconsulting), Visual Editor (webconsulting), Web Components (webconsulting), Vite (Netresearch), Solr (webconsulting) |
| **Video & Animation** | 9 skills | Remotion Best Practices (remotion-dev), HyperFrames (HeyGen), HyperFrames CLI (HeyGen), HyperFrames Registry (HeyGen), Website to HyperFrames (HeyGen), GSAP (HeyGen), Create Documentation (webconsulting), Micro-interactions (Dylan Tarre), Microinteractions (wondelai) |
| **Security & Enterprise** | 4 skills | Security Audit (Netresearch), Security Incident Reporting (webconsulting), Deepfake Detection (webconsulting), Enterprise Readiness (Netresearch) |
| **Database** | 1 skill | Postgres Best Practices (Supabase) |
| **Marketing** | 43 skills | Marketing Skills plus split growth, SEO, ads, lifecycle, research, prospecting, SMS, and sales enablement skills (Corey Haines) |
| **CRO & Growth** | 4 skills | CRO Funnel (AITYTech), Programmatic SEO (AITYTech), Launch Strategy (AITYTech), A/B Testing (AITYTech) |
| **Code Quality & Refactoring** | 20 skills | Architecture Decision Records (webconsulting), Auto Review (Peter Steinberger), Agent MD Refactor (Softaworks), Refactor (GitHub), Refactor Clean (sickn33), Find Skills (Vercel), Grill Me and engineering/productivity workflow skills (Matt Pocock) |
| **PHP & Tools** | 5 skills | PHP Modernization (Netresearch), CLI Tools (Netresearch), Context7 (Netresearch), Firecrawl (Firecrawl), Skill Creator (Anthropic) |
| **Frontend & Design** | 9 skills | Branding (webconsulting), UI Design Patterns (webconsulting), Frontend Design (Anthropic), Impeccable (pbakaus), Web Design Guidelines (Vercel), Excalidraw (ooiyeefei), OG Image (Stevy Smith), React Best Practices (Vercel), shadcn/ui (Giuseppe Trisciuoglio) |
| **Platform Design** | 8 skills | Android Design (ehmo), iOS Design (ehmo), iPadOS Design (ehmo), macOS Design (ehmo), tvOS Design (ehmo), visionOS Design (ehmo), watchOS Design (ehmo), Web Platform Design (ehmo) |
| **Documents & Office** | 1 skill | Document Processing (Anthropic) |
| **Legal & Compliance** | 1 skill | Legal Impressum (webconsulting) |
| **AI & SEO** | 2 skills | AI Search Optimization (webconsulting), Readiness Report (OpenHands) |
| **Total** | **137 skills** | Top-level skills in `skills/`; shared root guides and add-ons are not counted |
---
> ## 📢 A Quick Note
>
> These skills are here to be used. They can speed up research, implementation, and review,
> and a few ground rules are worth keeping in mind:
>
> - **Things change** — Anthropic, Cursor, and webconsulting continue to evolve their platforms. Updates and occasional breaking changes are normal.
> - **Review AI output** — Always check AI-generated code before committing or deploying. Human judgment still matters.
> - **Keep your local copy current** — Run `git pull && ./install.sh` regularly to pick up new skills, fixes, and compatibility updates.
>
> Questions, ideas, or feedback are always welcome.
---
## 🚀 Universal Agent Skills (5 Core Clients + Optional Tools)
Skills are installed as **symlinks** from the central `skills/` directory to the five core clients' discovery paths, plus a project-level `.agents/skills/` mirror for generic agent packages. The installer links whole skill directories, so `agents/`, `assets/`, `evals/`, `examples/`, `reference/`, `references/`, `rules/`, and `scripts/` stay available to clients that support them. One source of truth, many consumers.
To add a skill, create `skills/<slug>/SKILL.md` once. Do not add client-specific symlinks or duplicate per-client copies; `./install.sh` and `./update.sh` fan the canonical skill directory out automatically.
`SKILL.md` is the lightweight entry point. Keep routing metadata and the default workflow there, then move long examples, templates, troubleshooting matrices, and appendices into `references/` and link them from the skill body. This keeps skills compatible with Anthropic's current Agent Skills guidance while preserving full detail for clients that load bundled resources.
### Core Scripted Clients
| Client | Installation | Discovery |
|--------|-------------|-----------|
| **Cursor** | Symlinks to `~/.cursor/skills/` + `.cursor/skills/` + generated `.mdc` rule wrappers | Auto-discovery, `/skill-name` invocation |
| **Claude Code** | Symlinks to `~/.claude/skills/` | Auto-loaded from user skills |
| **Gemini CLI** | Symlinks to `~/.gemini/skills/` + `.gemini/skills/` + `gemini-extension.json` | Native extension manifest |
| **OpenAI Codex** | Symlinks to `~/.codex/skills/` + `.codex/skills/` | User and project-level discovery |
| **Windsurf** | Symlinks to `~/.codeium/windsurf/skills/` + `.windsurf/skills/` | User and project-level discovery |
| **Generic agents** | Symlinks to `.agents/skills/` | Project-level shared skill path |
### Native and Optional Clients
| Client Type | Setup | Notes |
|-------------|-------|-------|
| **GitHub Copilot, Cline, Aider** | Read `AGENTS.md` or their native instruction file | No separate skill-directory install needed |
| **Kiro and other skill-directory clients** | Add a manual symlink target once | Keep `skills/` as the only source of truth |
### Directory Structure After Install
```
~/.cursor/skills/ ← Cursor (user-level)
~/.claude/skills/ ← Claude Code (user-level)
~/.gemini/skills/ ← Gemini CLI (user-level)
~/.codex/skills/ ← OpenAI Codex (user-level)
~/.codeium/windsurf/skills/← Windsurf (user-level)
.cursor/
├── skills/ ← Cursor (project-level)
└── rules/ ← Legacy .mdc files (backwards compat)
.agents/skills/ ← Generic agent skill path (project-level)
.gemini/skills/ ← Gemini CLI (project-level)
.codex/skills/ ← OpenAI Codex (project-level)
.windsurf/skills/ ← Windsurf (project-level)
gemini-extension.json ← Gemini CLI extension manifest
catalog/skill-sources.json ← Skill source/provenance catalog
catalog/skill-audit.md ← Skill structure/source audit
AGENTS.md ← Read natively by Copilot, Codex, Windsurf, Cline, Aider
CLAUDE.md ← Claude Code primary instructions (→ AGENTS.md)
GEMINI.md ← Gemini CLI primary instructions (→ AGENTS.md)
.github/copilot-instructions.md ← GitHub Copilot instructions (→ AGENTS.md)
.windsurfrules ← Windsurf project rules (→ AGENTS.md)
```
### Adding a Skill
1. Create `skills/<slug>/SKILL.md`.
2. Use YAML frontmatter with at least `name` and `description`; `description` should say what the skill does and when to use it.
3. Keep the main `SKILL.md` concise. Put optional deep guidance in `references/`, deterministic helpers in `scripts/`, reusable input/output material in `assets/`, and runnable examples in `examples/`.
4. If the skill is upstream-managed, add one entry to `.sync-config.json`.
5. Run `npx -y skills-ref validate skills/<slug>` and `./install.sh --generate-only` to refresh the catalog, README-derived manifest data, and client files. Run `./install.sh` when you also want to deploy symlinks.
6. For local skills such as `typo3-webcomponents`, do not add per-skill install/update rules. `install.sh`, `update.sh`, `scripts/audit_skills.py`, and `scripts/generate_gemini_manifest.py` discover top-level skill directories automatically once the README/AGENTS trigger tables are updated.
Do not create manual per-client symlinks, duplicate `SKILL.md` files, or client-specific install rules for an individual skill. The installer loops over `skills/*` and populates every core client location automatically.
### Adding Other Tools
If a client has its own skills directory and is not one of the five core scripted clients, wire it once with a simple loop:
```bash
TARGET_DIR="$HOME/.kiro/skills" # replace with the client's skill path
mkdir -p "$TARGET_DIR"
for skill_dir in "$PWD"/skills/*; do
[ -f "$skill_dir/SKILL.md" ] || continue
ln -sfn "$skill_dir" "$TARGET_DIR/$(basename "$skill_dir")"
done
```
If the client reads an instruction file instead of a skills directory, point it at `AGENTS.md` or the client's native equivalent. Keep `skills/` as the canonical source and avoid copying `SKILL.md` files into per-tool folders.
### Using Skills
**In Cursor:**
1. **Auto-applied**: Cursor decides when skills are relevant
2. **Manual invoke**: Type `/typo3-content-blocks` in Agent chat
3. **View all**: Go to `Cursor Settings → Rules` to see discovered skills
**In Claude Code:**
1. Skills are automatically loaded from `~/.claude/skills/`
2. Reference skills in your prompts or let Claude auto-detect
**In Gemini CLI:**
1. Skills are discovered via `gemini-extension.json` manifest
2. Trigger-based activation matches your prompt to relevant skills
**In native-instruction clients:**
1. Use `AGENTS.md` or the client's native instruction file
2. No separate skill-directory install is required
**In optional manual clients:**
1. Point the client at its own skills directory
2. Use the symlink loop above to mirror `skills/*` into that directory
> **Note:** Legacy `.mdc` rules are still generated in `.cursor/rules/` for backwards compatibility.
---
## Quick Start
### Option 1: Standalone Installation (Recommended)
```bash
# Clone the repository
git clone git@github.com:dirnbauer/webconsulting-skills.git
cd webconsulting-skills
# Install skills
chmod +x install.sh
./install.sh
# Restart Cursor IDE or Claude Code
```
### Option 2: Clone as Project Subdirectory
```bash
# From your project root
git clone git@github.com:dirnbauer/webconsulting-skills.git webconsulting-skills
# Install skills (auto-detects parent project)
cd webconsulting-skills
./install.sh
# Skills are installed to the supported core AI client directories
```
> The installer auto-detects if it's running from a vendor directory, project subdirectory, or standalone clone, and adjusts paths accordingly.
### Alternative: Composer from GitHub (VCS)
Install this skills package directly from GitHub without Packagist.
**1. Add the repository to your project's `composer.json`:**
```json
{
"repositories": [
{
"type": "vcs",
"url": "https://github.com/dirnbauer/webconsulting-skills"
}
]
}
```
**2. Require the package:**
```bash
composer require --dev webconsulting/webconsulting-skills:dev-main
```
The Composer plugin will automatically run `install.sh` after installation to deploy skills to the supported core AI client directories.
## How to Use Agent Skills
### Skills for Dummies
**What are Agent Skills?** They're Markdown entry points (`SKILL.md`) plus optional bundled resources (`references/`, `scripts/`, `assets/`, `examples/`, and similar folders). Your AI coding assistant reads the entry point first and loads referenced material only when the task needs it. After running `./install.sh`, whole skill directories are symlinked to the supported core AI client directories and automatically discovered.
**How do they work?**
- **Auto-applied**: Cursor's Agent decides when a skill is relevant based on your query
- **Manual invoke**: Type `/skill-name` in chat (e.g., `/remotion-best-practices`, `/security-audit`)
- **Trigger keywords**: Mentioning keywords like "video", "animation", "security audit", or "content-blocks" activates relevant skills
**Where do skills live?**
- Source directories: `skills/*/` (this repo)
- Entry points: `skills/*/SKILL.md`
- Bundled detail: `skills/*/references/`, `skills/*/scripts/`, `skills/*/assets/`, `skills/*/evals/`, `skills/*/examples/`, and other local support folders
- User-level: `~/.cursor/skills/`, `~/.claude/skills/`, `~/.gemini/skills/`, `~/.codex/skills/`, `~/.codeium/windsurf/skills/`
- Project-level: `.cursor/skills/`, `.gemini/skills/`, `.codex/skills/`, `.windsurf/skills/`
- Legacy rules: `.cursor/rules/*.mdc` wrappers point Cursor to the full skill directory (backwards compatibility)
- Cross-client: `AGENTS.md`, `CLAUDE.md`, `GEMINI.md`, `.windsurfrules`, `.github/copilot-instructions.md`, `gemini-extension.json`
- Optional/manual clients: any tool-specific skills directory you wire to `skills/`
- Adding a skill only touches `skills/` and, for upstream-managed skills, `.sync-config.json`
### Skill Reference
| Skill | Trigger Keywords | Example Prompt |
|-------|------------------|----------------|
| `architecture-decision-records` | adr, architecture decision record, decision log, retrospective adr, superseded decision | "Reconstruct and validate ADRs from this repository's Git history" |
| `agent-md-refactor` | refactor agents.md, split instructions, organize claude.md | "Refactor my AGENTS.md - it's too long" or "Split my CLAUDE.md into focused files" |
| `autoreview` | autoreview, Codex review, Claude review, second-model review, closeout review | "Run autoreview before I commit" or "Run a Codex review on this branch" |
| `refactor` | refactor, clean up, code smell, improve code, extract method | "Refactor this function" or "Clean up this code and remove duplication" |
| `refactor-clean` | refactor, clean code, solid, maintainability | "Apply SOLID principles to this module" or "Find code smells and fix them" |
| `find-skills` | find skill, install skill, npx skills, skills.sh | "Find a skill for React performance" or "Search skills.sh for testing tools" |
| `caveman` | caveman mode, talk like caveman, use caveman, less tokens, be brief | "Use caveman mode for the rest of this debugging session" |
| `grill-me` | grill me, stress-test plan, stress-test design, challenge my plan | "Grill me on this implementation plan" or "Stress-test this architecture one question at a time" |
| `diagnose` | diagnose this, debug this, bug, broken, failing, performance regression | "Diagnose this failing checkout flow" or "Debug this performance regression" |
| `grill-with-docs` | grill with docs, stress-test with docs, context.md, adr, domain model | "Grill this plan against the codebase docs" or "Challenge this design and update ADRs" |
| `handoff` | handoff, hand off, continue later, another agent, summarize context | "Write a handoff for the next agent to continue this work" |
| `improve-codebase-architecture` | improve architecture, refactoring opportunities, testable codebase, deep modules | "Find architecture deepening opportunities in this codebase" |
| `prototype` | prototype, sanity-check, data model, state machine, mock up ui, try a few designs | "Prototype this state machine" or "Try a few UI designs before implementation" |
| `setup-matt-pocock-skills` | setup matt pocock skills, issue tracker, triage labels, domain docs, agent skills block | "Set up Matt Pocock's skills for this repository" |
| `tdd` | tdd, red-green-refactor, test-first, integration tests, failing test | "Build this feature using TDD" or "Write the failing test first" |
| `to-issues` | to issues, create issues, implementation tickets, break down work, vertical slices | "Turn this PRD into independently grabbable issues" |
| `to-prd` | to prd, create prd, product requirements, current context | "Turn this conversation into a PRD issue" |
| `triage` | triage, issue workflow, incoming bugs, feature requests, ready for agent | "Triage the open issues and prepare agent-ready tickets" |
| `write-a-skill` | write a skill, create skill, build a new skill, agent skill, bundled resources | "Write a new skill for our release workflow" |
| `zoom-out` | zoom out, broader context, high-level perspective, unfamiliar code | "Zoom out and map how this area fits into the system" |
| `shadcn-ui` | shadcn, radix, tailwind, components, form, dialog, button | "Set up shadcn/ui in my Next.js project" or "Build a form with Zod validation" |
| `typo3-accessibility` | accessibility, a11y, wcag, aria, screen reader, keyboard navigation | "Run WCAG 2.2 AA audit on my TYPO3 site" or "Add skip-to-content link" |
| `typo3-batch` | batch, migrate, bulk, mass refactor, codemod | "Batch migrate all hooks to PSR-14 events" or "Batch modernize all TCA files" |
| `typo3-content-blocks` | content-blocks, content-element, record-type, migrate tca | "Create a Content Block for a hero banner" or "Migrate my TCA to Content Blocks" |
| `typo3-shadcn-content-elements` | shadcn, content elements, Content Blocks, Fluid, backend previews, icons, seed script | "Overhaul EXT:desiderio content elements for shadcn preset b4hb38Fyj" or "Audit Content Blocks field coverage and seed data" |
| `desiderio-teach` | add topic to teach, create lesson content, Desiderio learning page, teach in TYPO3 | "Create a TYPO3 lesson page that teaches editors how to use schema markup with Desiderio content elements" |
| `typo3-translations` | xliff, translations, localization, labels.xlf, locallang.xlf, lll, icu messageformat, translation domains | "Audit my TYPO3 13/14 labels before upgrading to XLIFF 2.0" or "Convert v14-only Content Blocks labels to XLIFF 2.0 with German targets" |
| `typo3-idea-extension-blog` | idea to extension, product announcement, adapt to TYPO3, blog post pipeline, MDX blog | "Turn this product announcement into a TYPO3 extension and German blog post" or "Assess this article for TYPO3 and build the useful parts" |
| `typo3-news-tags` | news tags, EXT:news, thematic tags, bulk tagging, tx_news_domain_model_tag, b13/tag | "Generate thematic EXT:news tags for this corpus" or "Build a command to assign news tags in bulk" |
| `typo3-datahandler` | database, datahandler, records, tcemain | "Create a tt_content record using DataHandler" |
| `typo3-ddev` | ddev, local, docker, environment | "Set up DDEV for TYPO3 v14" |
| `typo3-testing` | testing, phpunit, e2e, coverage | "Write unit tests for my repository" |
| `typo3-conformance` | conformance, standards, quality | "Check if my extension meets TYPO3 standards" |
| `typo3-docs` | documentation, rst, docs | "Create RST documentation for my extension" |
| `typo3-core-contributions` | core, gerrit, forge, patch | "Submit a patch to TYPO3 Core" |
| `typo3-initial-release` | initial release, 1.0.0, release readiness, release tag, TER, Packagist | "Prepare this TYPO3 14.3+ extension for v1.0.0" or "Run final release readiness review before tagging" |
| `typo3-rector` | rector, refactoring, deprecation | "Use Rector to fix deprecations" |
| `typo3-update` | update, upgrade, v14, migration, TYPO3 core | "Follow TYPO3 v14 patterns for my extension" |
| `typo3-14-update` | complete v14 update, v14-only, production rollout, post-upgrade SEO, post-upgrade security, post-upgrade Solr | "Upgrade this project end-to-end to TYPO3 14.3 LTS and verify production readiness" |
| `typo3-extension-upgrade` | extension upgrade, fractor | "Upgrade my extension to TYPO3 v14" |
| `typo3-fractor` | fractor, flexform, typoscript migration, fluid migration | "Use Fractor to migrate FlexForms and TypoScript" |
| `typo3-icon14` | icons, module icons, plugin icons, record icons, action icons, icon migration, Configuration/Icons.php | "Design or migrate TYPO3 v14 extension icons with live Core references" |
| `typo3-security` | security, hardening, permissions | "Harden my TYPO3 installation" |
| `typo3-seo` | seo, sitemap, meta, opengraph | "Configure SEO with sitemaps and meta tags" |
| `typo3-simplify` | simplify, clean up, refine, code quality, reduce complexity | "Simplify my TYPO3 code" or "Replace GeneralUtility::makeInstance with DI" |
| `typo3-wcag22-aa-agentic` | wcag 2.2 aa, accessibility audit, axe-core, playwright, deque mcp, accessibility statement, eaa, bafg, bfsg | "Run an agentic WCAG 2.2 AA audit on this TYPO3 site" or "Scaffold accessibility tooling and statement drafts for a DACH TYPO3 project" |
| `typo3-powermail` | powermail, mailform, form extension, tx_powermail | "Create a contact form with custom finisher" or "Configure spam shield" |
| `typo3-workspaces` | workspace, versioning, staging, publishing, draft content | "Set up workspace workflow" or "Debug workspace overlay" |
| `typo3-visual-editor` | visual editor, inline editing, f:render.text, f:render.contentArea, f:mark.contentArea, PAGEVIEW, colPos | "Install and configure FriendsOfTYPO3 Visual Editor" or "Update my Fluid templates for f:render.contentArea and f:render.text" |
| `typo3-webcomponents` | web components, Lit, LitElement, backend JavaScript, JavaScriptModules.php, f:asset.module, @typo3 modules, backend module UI, Form Editor | "Create a TYPO3 v14 backend Web Component with Lit" or "Should I use TYPO3 backend Web Components in the frontend?" |
| `typo3-vite` | vite, vite-asset-collector, scss, bootstrap, svg, postcss, csp | "Set up Vite for my TYPO3 sitepackage" or "Configure vite-asset-collector with Bootstrap theming" |
| `typo3-records-list-types` | records list types, grid view backend, compact view, teaser view | "Set Grid View as default" or "Create custom Timeline view" |
| `typo3-solr` | solr, search, indexing, facets, suggest, autocomplete, vector search | "Set up EXT:solr with DDEV" or "Debug Solr indexing issues" |
| `ai-search-optimization` | aeo, geo, ai search, chatgpt, llms.txt | "Optimize for ChatGPT and Perplexity citations" |
| `security-audit` | security audit, owasp, vulnerabilities | "Audit my controller for security issues" |
| `security-incident-reporting` | incident report, post-mortem, ddos, forensics | "Create NIST/SANS-style incident report" or "Document DDoS attack timeline" |
| `enterprise-readiness` | enterprise, openssf, slsa | "Assess my project for enterprise readiness" |
| `php-modernization` | php, phpstan, dto, enum | "Modernize my PHP code to 8.3 patterns" |
| `cli-tools` | cli, tools, command not found | "Install missing CLI tools" |
| `context7` | documentation, api, libraries | "Look up current Symfony documentation" |
| `webconsulting-branding` | branding, no borders, project icons | "Apply the borderless webconsulting design system" |
| `ui-design-patterns` | ui, design, layout, typography | "Improve the visual hierarchy of my UI" |
| `remotion-best-practices` | remotion, video, react, animation, composition | "Create a video intro with fade-in text animation" |
| `hyperframes` | hyperframes, video composition, captions, subtitles, voiceover, audio reactive, transitions | "Create a 10-second HTML-based product intro with captions and scene transitions" |
| `hyperframes-cli` | hyperframes init, hyperframes lint, hyperframes preview, hyperframes render, hyperframes tts | "Scaffold a HyperFrames project, lint it, preview it, and render a draft" |
| `hyperframes-registry` | hyperframes add, hyperframes.json, block, component, registry | "Install the data-chart block with hyperframes add and wire it into index.html" |
| `website-to-hyperframes` | website to video, capture this site, turn this into a video, social ad, product tour | "Capture this marketing site and turn it into a 20-second launch video" |
| `gsap` | gsap, animation, timeline, easing, stagger, quickTo | "Write a GSAP timeline for a HyperFrames scene with staggered text" |
| `micro-interactions` | micro-interaction, hover state, button press, toggle, ripple, focus ring, badge update | "Design the press and hover animation for these buttons" or "Add a tasteful ripple to this toggle" |
| `microinteractions` | microinteraction, trigger design, feedback pattern, loops and modes, signature moment, form validation feedback | "Audit this toggle against Dan Saffer's microinteractions framework" or "Score this loading state 0-10 on triggers / rules / feedback / loops" |
| `webconsulting-create-documentation` | documentation, help page, product video, screenshots, tts, gsap | "Create product documentation with video tour" or "Build a help page" |
| `excalidraw` | excalidraw, architecture diagram, system diagram, png export, svg export | "Generate an architecture diagram for this project as an .excalidraw file" or "Create a system diagram and export it as SVG" |
| `react-best-practices` | react, next.js, performance, optimization, bundle size, waterfalls | "Optimize this React component" or "Eliminate request waterfalls" |
| `deepfake-detection` | deepfake, media forensics, fake detection, synthetic media, prnu | "Verify authenticity of this video" or "Detect AI-generated images" |
| `readiness-report` | /readiness-report, agent readiness, codebase maturity | "Run /readiness-report to evaluate this repository" |
| `postgres-best-practices` | postgres, sql, database, query, index, rls, supabase | "Optimize this slow Postgres query" or "Set up RLS for multi-tenant" |
| `marketing-skills` | marketing, cro, conversion, landing page, pricing | "Optimize this landing page" or "Write homepage copy" |
| `ad-creative` | ad creative, ad copy variations, rsa headlines, creative testing | "Generate 20 Google RSA headlines for this offer" |
| `ads` | ads, ppc, paid media, roas, cpa, retargeting | "Plan a LinkedIn ads campaign for this SaaS" |
| `ai-seo` | ai seo, aeo, geo, llmo, ai overviews, perplexity | "Optimize this article for AI Overviews and Perplexity" |
| `analytics` | analytics, ga4, gtm, event tracking, attribution | "Create a GA4 event tracking plan for signup" |
| `aso` | aso, app store optimization, app listing, google play | "Audit this App Store listing for ASO" |
| `churn-prevention` | churn, cancel flow, dunning, retention, win-back | "Improve this SaaS cancel flow" |
| `co-marketing` | co-marketing, partner marketing, joint campaign, partnership ideas | "Find co-marketing partners for this product" |
| `cold-email` | cold email, cold outreach, prospecting email, sales email | "Write a 4-step cold email sequence" |
| `community-marketing` | community marketing, discord community, slack community, community-led growth | "Design a community launch plan" |
| `competitor-profiling` | competitor profile, competitor research, competitive intelligence | "Profile these three competitors" |
| `competitors` | alternative page, vs page, competitor comparison, battlecard | "Create an alternative page outline" |
| `content-strategy` | content strategy, content plan, editorial calendar, topics | "Build a 90-day content strategy" |
| `copy-editing` | copy editing, edit copy, review copy, copy feedback | "Edit this landing page copy" |
| `copywriting` | copywriting, homepage copy, landing page copy, cta copy | "Write homepage copy for this SaaS" |
| `corey-ab-testing` | corey ab testing, growth experiments, ice score, statistical significance | "Build an experiment backlog for this funnel" |
| `corey-programmatic-seo` | corey programmatic seo, pseo, template pages, data-driven pages | "Plan 100 comparison pages using product data" |
| `cro` | cro, conversion optimization, landing page optimization, form cro | "Audit this landing page for conversion issues" |
| `customer-research` | customer research, icp research, user interviews, voice of customer | "Synthesize these customer interview notes" |
| `directory-submissions` | directory submissions, submit startup, saas directories, backlinks | "Find directories to submit this AI tool" |
| `emails` | email sequence, drip campaign, lifecycle email, onboarding email | "Write a trial onboarding email sequence" |
| `free-tools` | free tool, engineering as marketing, lead generation tool | "Brainstorm free tools for this SaaS" |
| `image` | marketing image, social graphic, product mockup, blog hero | "Create prompts for product launch images" |
| `launch` | launch, product hunt, feature release, announcement | "Plan this feature launch" |
| `lead-magnets` | lead magnet, gated content, checklist, ebook, template | "Create a lead magnet for this audience" |
| `marketing-ideas` | marketing ideas, growth ideas, how to market, acquisition ideas | "Give me marketing ideas for this product" |
| `marketing-psychology` | marketing psychology, mental models, cognitive bias, persuasion | "Apply psychology to improve this page" |
| `onboarding` | onboarding, activation, first-run experience, time to value | "Optimize this onboarding flow" |
| `paywalls` | paywall, upgrade screen, upsell, feature gate | "Improve this upgrade paywall" |
| `popups` | popup, modal, exit intent, slide-in, banner | "Design an exit-intent popup" |
| `pricing` | pricing, pricing tiers, freemium, packaging, monetization | "Review these pricing tiers" |
| `product-marketing` | product marketing, positioning, messaging, marketing context | "Create a product marketing context file" |
| `prospecting` | prospecting, build a prospect list, find prospects, find leads, lead gen list, target account list, qualified leads | "Build a qualified prospect list for this ICP" |
| `referrals` | referral, affiliate, ambassador, word of mouth, viral loop | "Design a referral program" |
| `revops` | revops, lead scoring, lead routing, mql, sql, crm automation | "Design a lead scoring model" |
| `sales-enablement` | sales enablement, sales deck, pitch deck, one-pager, demo script | "Create a sales one-pager outline" |
| `schema` | schema, structured data, json-ld, rich snippets, schema.org | "Add FAQ schema to this page" |
| `seo-audit` | seo audit, technical seo, indexing issues, core web vitals | "Audit this site for SEO issues" |
| `signup` | signup, registration, trial activation, signup abandonment | "Optimize this signup flow" |
| `site-architecture` | site architecture, sitemap, site structure, navigation, internal linking | "Plan the sitemap for this SaaS site" |
| `sms` | sms marketing, text message campaigns, sms sequence, sms automation, abandoned cart text, tcpa, a2p 10dlc, twilio | "Plan an abandoned cart SMS sequence with compliance notes" |
| `social` | social media, linkedin post, twitter thread, content calendar, reels | "Create a LinkedIn content calendar" |
| `video` | video, ai video, remotion, hyperframes, heygen, product demo video | "Plan a product demo video" |
| `og-image` | og-image, open graph, social preview, twitter card, meta tags | "Generate an OG image" or "Set up Twitter card meta tags" |
| `frontend-design` | frontend, design, creative, beautiful, distinctive, aesthetics | "Create a distinctive landing page" or "Design a dark tech hero section" |
| `impeccable` | impeccable, design, redesign, shape, critique, audit, polish, craft, live UI | "Use impeccable to polish this product UI" or "Run impeccable shape for this onboarding flow" |
| `web-design-guidelines` | web design, accessibility, a11y, wcag, aria, semantic html | "Review this component for accessibility issues" or "Audit my form for WCAG" |
| `document-processing` | pdf, docx, word, pptx, powerpoint, xlsx, excel | "Extract text from this PDF" or "Create an Excel model with formulas" |
| `firecrawl` | scrape, crawl, search web, research, fetch url | "Search the web for..." or "Scrape this page" |
| `skill-creator` | create skill, new skill, skill creator, package skill, SKILL.md | "Create a new skill for database migrations" or "Package my skill" |
| `android-design` | android, material design, jetpack compose, material you | "Review my Android app for Material Design" |
| `ios-design` | ios, iphone, swiftui, dynamic type, dark mode | "Review my iOS app for HIG compliance" |
| `ipados-design` | ipad, ipados, split view, stage manager, sidebar | "Add keyboard shortcuts to my iPad app" |
| `macos-design` | macos, mac app, appkit, menu bar, toolbar | "Create a Mac app with proper menu bar" |
| `tvos-design` | tvos, apple tv, siri remote, focus navigation | "Design 10-foot UI for Apple TV" |
| `visionos-design` | visionos, vision pro, spatial computing | "Design spatial UI for Vision Pro" |
| `watchos-design` | watchos, apple watch, complications, digital crown | "Create glanceable watchOS interface" |
| `web-platform-design` | wcag, web platform, responsive, accessibility, i18n | "Audit my web app for WCAG 2.2" |
| `ab-testing` | ab test, split test, experiment, hypothesis | "Design A/B test for my homepage" |
| `cro-funnel` | cro funnel, form cro, signup flow, onboarding, paywall | "Optimize my signup flow" |
| `programmatic-seo` | programmatic seo, template pages, directory, location pages | "Build [service] in [city] pages at scale" |
| `launch-strategy` | product launch, product hunt, gtm, beta launch | "Plan my Product Hunt launch" |
| `legal-impressum` | impressum, legal notice, austria, offenlegung, germany, DDG | "Create Austrian Impressum for a GmbH" or "German DDG-compliant legal notice" |
### Example Prompts (Copy & Paste)
#### 🔧 Code Refactoring
**Refactor Code (refactor, refactor-clean):**
```
This function is 200 lines long with deeply nested conditionals. Refactor it into smaller, focused functions with guard clauses.
```
```
Find all code smells in my UserService class: duplication, god object, long parameter lists, magic numbers.
```
```
Apply the Strategy pattern to replace this long switch statement for shipping calculation.
```
```
Create a refactoring plan for this legacy module. Identify risky hotspots, propose incremental steps, and keep behavior stable.
```
```
Remove dead code, extract duplicated logic into shared utilities, and add proper TypeScript types.
```
**Refactor Agent Instructions (agent-md-refactor):**
```
My AGENTS.md is 500 lines and hard to maintain. Refactor it using progressive disclosure: keep essentials at root, split the rest into linked topic files.
```
```
Find contradictions in my CLAUDE.md file and flag vague instructions for deletion.
```
```
Reorganize my agent config into: code-style.md, testing.md, architecture.md, and git-workflow.md
```
**Find and Install Skills (find-skills):**
```
Find a skill for React performance optimization on skills.sh
```
```
Search for available skills related to deployment automation
```
```
Install the refactor skill from github/awesome-copilot@refactor using npx skills
```
**shadcn/ui Components:**
```
Set up shadcn/ui in my Next.js project and create a login form with email/password validation using React Hook Form and Zod
```
```
Build a dashboard with shadcn/ui: Card grid for stats, data Table with pagination, and toast notifications for actions
```
```
Create a settings dialog using shadcn/ui Dialog with a form inside. Include text inputs, a select dropdown for role, and a checkbox for notifications.
```
```
Customize the shadcn/ui Button component with a new "gradient" variant and an "xl" size option
```
---
#### 🏗️ Project Setup & Environment
**New TYPO3 Project:**
```
Set up a new TYPO3 v14 project with DDEV, Redis caching, and Mailpit for email testing
```
**Multi-Site Configuration:**
```
Configure a multi-site setup with 3 domains sharing the same TYPO3 installation, each with German and English languages
```
**Database Operations:**
```
Export the database from production, sanitize sensitive data, and import it into my local DDEV environment
```
**Xdebug Setup:**
```
Configure Xdebug in DDEV for step debugging with Cursor/PhpStorm, including the correct IDE key settings
```
---
#### 📦 Content Blocks (Single Source of Truth)
**Hero Banner Content Element:**
```
Create a Content Block for a hero banner with: headline, subheadline, background image, CTA button link, and overlay color selection
```
**Team Members Record Type:**
```
Create a Content Block Record Type for team members with: name, position, email, phone, bio (richtext), photo, and social media links (Collection). Use Extbase-compatible table naming.
```
**Accordion Content Element:**
```
Create a Content Block for an accordion with unlimited items. Each item has a title, richtext content, and "initially open" checkbox. Include frontend.fluid.html and backend-preview.fluid.html templates.
```
**FAQ with Categories:**
```
Create a Record Type for FAQs with question, answer, and category relation. Then create a Content Element that displays FAQs filtered by selected categories.
```
**Image Slider with IRRE:**
```
Create a slider Content Block using a Collection field. Each slide has: image (required), title, description, and link. Limit to 10 slides max.
```
**shadcn Content Elements:**
```
Audit every ContentBlocks/ContentElements entry in EXT:desiderio. Fix field coverage, labels, backend previews, icons, and seed data so the elements follow shadcn preset b4hb38Fyj.
```
```
Apply a new shadcn/create preset to the TYPO3 Fluid component layer. Preserve preset tokens, shared atoms/molecules, borders, radius, spacing, and dark mode behavior.
```
```
Regenerate layout module previews for all custom Content Blocks. Show the headline, important repeatable items, CTA, thumbnails, chart summary, and warnings for empty data.
```
---
#### Visual Editor (Inline Editing)
**Install and configure Visual Editor:**
```
Install friendsoftypo3/visual-editor in my TYPO3 project. Show the Composer commands, required cache/database steps, editor permissions to check, and a rollback/removal plan.
```
**Migrate page columns:**
```
Update my page Fluid template for the new Visual Editor. Replace <f:cObject typoscriptObjectPath="lib.dynamicContent" data="{colPos: '3'}"/> with the correct f:render.contentArea usage and explain how colPos maps to backend layout identifiers.
```
**Make backend fields editable:**
```
Audit my content element Fluid templates and replace editable backend text fields like {record.header}, {record.subheader}, and richtext bodytext output with f:render.text where appropriate.
```
**Troubleshoot visual editing:**
```
The Visual Editor opens, but inline editing and drag-and-drop do not work for my custom sitepackage. Check content areas, record-transformation, f:render.text, f:mark.contentArea fallbacks, frontend CSS, and workspace/language edge cases.
```
---
#### 🔄 Content Blocks Migration (Classic → Modern)
**Migrate Content Element:**
```
Migrate my classic content element from TCA/SQL to Content Blocks. Here's my current TCA in Configuration/TCA/Overrides/tt_content.php: [paste TCA]
```
**Migrate Record Table:**
```
Convert my classic tx_myext_domain_model_product table (with TCA and ext_tables.sql) to a Content Blocks Record Type. Keep the same table name for data compatibility.
```
**Analyze TCA for Migration:**
```
Analyze this TCA configuration and show me the equivalent Content Blocks config.yaml with all field mappings: [paste TCA]
```
**Migrate IRRE Relations:**
```
My extension has inline (IRRE) child records. Show me how to migrate the parent-child relationship to Content Blocks Collection fields.
```
**Keep Column Names:**
```
Migrate my content element to Content Blocks but keep the existing database column names (tx_myext_*) to avoid data migration. Use prefixField: false.
```
**Data Migration Script:**
```
Create a CLI command that migrates existing content from CType 'myext_hero' to the new Content Blocks CType 'myvendor_hero', including column mapping.
```
**Full Extension Migration:**
```
I have a classic TYPO3 extension with 3 content elements and 2 record types. Create a complete migration plan to Content Blocks, including which files to delete afterward.
```
---
#### ⏪ Content Blocks Revert (Modern → Classic)
**Revert Content Element:**
```
Revert my Content Block hero element back to classic TCA/SQL format. Here's my config.yaml: [paste config.yaml]. Generate the complete TCA, SQL, and TypoScript files.
```
**Revert Record Type:**
```
Convert my Content Blocks Record Type back to a classic TCA configuration. Generate the full TCA file with ctrl section, columns, and types. Table: tx_myext_domain_model_product
```
**Generate TCA from YAML:**
```
Analyze this Content Blocks config.yaml and generate the equivalent classic TCA PHP configuration with all field mappings: [paste config.yaml]
```
**Revert IRRE Collection:**
```
My Content Block uses a Collection field with inline child records. Show me how to revert this to classic TCA inline configuration with a separate child table.
```
**Revert Data Migration:**
```
Create a CLI command that reverts content from Content Blocks CType 'myvendor_hero' back to classic CType 'myext_hero', including copying data between columns.
```
**Update Fluid Templates for Classic:**
```
Update my Content Blocks Fluid template to work with classic TCA. Replace {data.fieldname} with {data.tx_myext_fieldname} and add proper DataProcessors for file relations.
```
**Full Extension Revert:**
```
I need to completely remove Content Blocks from my extension with 2 content elements and 1 record type. Create all necessary TCA, SQL, TypoScript files and a data migration script.
```
**Remove Content Blocks Dependency:**
```
After reverting to classic TCA, how do I safely remove the friendsoftypo3/content-blocks dependency and clean up orphaned database columns?
```
**Compare Approaches:**
```
Show me a side-by-side comparison of the same content element in Content Blocks vs classic TCA format, highlighting the pros and cons of each approach.
```
---
#### 🔧 Extension Development
**DataHandler CRUD:**
```
I need to create, update, and delete records in tx_myext_domain_model_product programmatically using DataHandler. Show me the proper pattern with transaction handling and error checking.
```
**Repository with Custom Query:**
```
Create a repository for my Product model with methods: findByCategory(), findInPriceRange(), and findFeatured(). Use proper typing and QueryBuilder.
```
**Extbase Controller:**
```
Create an Extbase controller with list, show, and filter actions for my Event model. Include proper request handling for TYPO3 v14.
```
**PSR-14 Event Listener:**
```
Create a PSR-14 event listener that modifies page titles before rendering. Register it in Services.yaml with the AsEventListener attribute.
```
**Scheduler Task:**
```
Create a Scheduler task that imports products from an external API daily. Include progress reporting and proper error handling.
```
**Backend Module:**
```
Create a backend module for managing newsletter subscriptions with list view, export to CSV, and bulk delete functionality.
```
**Middleware:**
```
Create a PSR-15 middleware that adds security headers (CSP, X-Frame-Options, etc.) to all frontend responses.
```
---
#### 🔄 Upgrades & Migration
**Extension Upgrade v12 → v14:**
```
Upgrade my extension from TYPO3 v12 to support TYPO3 v14. Use Rector for automated refactoring and show me what needs manual attention.
```
**Fix Deprecations:**
```
Scan my extension for deprecated code and fix all deprecations for TYPO3 v14. Use typo3-rector rules.
```
**TYPO3 v14 patterns:**
```
My extension targets TYPO3 v14. Show me current core APIs and patterns for the v14 breaking changes.
```
**Fractor for Non-PHP Files:**
```
Use Fractor to update my TypoScript, Fluid templates, and YAML files for TYPO3 v14 compatibility.
```
---
#### 🧪 Testing
**Unit Tests:**
```
Write unit tests for my ProductService class. Mock the repository and test the calculateDiscount() method with various inputs.
```
**Functional Tests:**
```
Set up functional tests for my ProductRepository. Include database fixtures and test findByCategory() with actual database queries.
```
**E2E Tests with Playwright:**
```
Write Playwright E2E tests for my contact form: test form submission, validation errors, and success message.
```
**GitHub Actions CI:**
```
Create a GitHub Actions workflow that runs PHPUnit tests, PHPStan analysis, and PHP-CS-Fixer on PHP 8.2 and 8.3 with TYPO3 v14.
```
---
#### 🔒 Security & Hardening
**Security Audit:**
```
Perform a security audit on my AuthController and UserService. Check for XSS, CSRF, SQL injection, and insecure session handling.
```
**Production Hardening:**
```
Create a security hardening checklist for my TYPO3 installation before going live. Include file permissions, configuration, and server settings.
```
**OWASP Compliance:**
```
Review my extension against OWASP Top 10 vulnerabilities and suggest fixes for any issues found.
```
---
#### 📈 SEO & Performance
**Full SEO Setup:**
```
Configure complete SEO for my TYPO3 site: XML sitemap with custom entries, OpenGraph/Twitter cards, canonical URLs, robots.txt, and structured data for articles.
```
**Meta Tags Configuration:**
```
Set up proper meta tag configuration with fallbacks: use page-specific tags if set, otherwise fall back to site-wide defaults.
```
**Hreflang for Multi-Language:**
```
Configure hreflang tags for my multi-language site with German, English, and French. Handle default language and x-default correctly.
```
---
#### 🤖 AI Search Optimization (AEO/GEO)
**Schema Markup for AI Search (TYPO3):**
```
Add FAQPage, Article, and Organization schema to my TYPO3 site using EXT:schema. Make content more likely to be cited by ChatGPT and Perplexity.
```
**Robots.txt for AI Crawlers:**
```
Configure robots.txt to allow AI search bots (GPTBot, PerplexityBot, ClaudeBot) while blocking AI training crawlers (Google-Extended, CCBot). Use TYPO3 site config static routes.
```
**llms.txt for TYPO3:**
```
Implement llms.txt for my TYPO3 site using web-vision/ai-llms-txt extension. Configure which pages to include and how to structure the index.
```
**llms.txt for Next.js/Astro:**
```
Create a dynamic llms.txt endpoint for my Next.js documentation site. Generate the index from content collections and include llms-full.txt with complete docs.
```
**FAQ Content Element with Schema:**
```
Create a TYPO3 Content Block for FAQ accordion that automatically generates FAQPage schema. Each item has question, answer, and initially-open checkbox.
```
**Article Schema with Author (TYPO3):**
```
Add Article schema with author information to my TYPO3 pages using a PSR-14 event listener. Include author name, credentials, LinkedIn, and dates.
```
**MDX JSON-LD Component:**
```
Create a reusable Next.js MDX component that generates Article schema from frontmatter (title, description, date, author). Include proper TypeScript types.
```
**FAQ Schema Component (MDX):**
```
Create a React FAQ component for MDX that renders an accessible accordion AND generates FAQPage schema. Use details/summary for no-JS support.
```
**E-E-A-T Author Bios:**
```
Add author bio fields to my TYPO3 pages (name, credentials, LinkedIn, bio) via TCA extension. Generate Person schema automatically for each page.
```
**Content Freshness Signals:**
```
Configure visible last-modified dates on my TYPO3 pages using SYS_LASTCHANGED. Add HTTP headers and structured data for content freshness.
```
**AI Search Visibility Audit:**
```
Audit my website for AI search visibility: check schema markup quality, E-E-A-T signals, content structure, robots.txt configuration, and llms.txt presence.
```
**Monitor AI Citations:**
```
What tools can I use to monitor how often my brand is mentioned in ChatGPT, Perplexity, and Google AI Overviews? Set up tracking.
```
**Raw MDX View Endpoint:**
```
Add a .md URL suffix to my Next.js docs that shows raw MDX source instead of rendered content. Similar to how Vercel docs works.
```
**Optimize for Perplexity:**
```
Perplexity prefers fresh content. How do I optimize my content update frequency and visible timestamps to maximize Perplexity citations?
```
**Google AI Overviews Optimization:**
```
What specific schema types and content structures increase the chance of appearing in Google AI Overviews? Implement for my TYPO3 site.
```
---
#### 📚 Documentation
**Extension Documentation:**
```
Create RST documentation for my extension following docs.typo3.org standards. Include: introduction, installation, configuration, and usage sections.
```
**API Documentation:**
```
Document my public API methods using proper RST format with code examples and configuration references.
```
---
#### 🏢 Enterprise & Quality
**PHPStan Level 9:**
```
Configure PHPStan at level 9 for my extension. Fix all errors and add proper type hints to pass the analysis.
```
**Enterprise Readiness:**
```
Assess my extension for enterprise readiness: OpenSSF best practices, supply chain security, and quality gates for CI/CD.
```
**Code Quality Gates:**
```
Set up quality gates for my project: PHPStan level 8+, test coverage >80%, no critical security issues, and proper documentation.
```
---
#### 🎨 Frontend & UI
**Fluid Component:**
```
Create a reusable Fluid partial for a card component with image, title, description, link, and optional badge. Make it work with Content Blocks data.
```
**Accessible Form:**
```
Review my contact form for accessibility issues. Ensure proper labels, error messages, focus management, and ARIA attributes.
```
**Design System Integration:**
```
Apply the webconsulting design system to my TYPO3 templates: colors, typography, spacing, and component styles.
```
---
#### ✨ Creative Frontend Design (frontend-design)
The `frontend-design` skill helps you create **distinctive, memorable interfaces** that avoid generic "AI slop" aesthetics. It covers typography, color, motion, spatial composition, and component design.
**Distinctive Landing Pages:**
```
Create a landing page that looks nothing like a typical SaaS template. Use bold typography, asymmetric layout, and a unique color palette.
```
```
Design a dark-mode landing page with a gradient mesh background, floating elements, and glass morphism cards.
```
```
Build a brutalist-style landing page with raw aesthetics, monospace fonts, and intentional visual tension.
```
**Typography That Stands Out:**
```
Suggest distinctive font pairings for my tech startup. Avoid Inter, Roboto, and other overused fonts.
```
```
Create a typography system with a display font for headlines and a body font that pairs well. Show me the CSS variables.
```
```
Design a heading hierarchy with variable font weights, tight letter-spacing, and optical sizing.
```
**Color Palettes:**
```
Create a cohesive color palette for a fintech app. Use a dominant color for 60%, secondary for 30%, and accent for 10%.
```
```
Design a dark theme color system with proper contrast ratios, surface elevation colors, and accent states.
```
```
Generate a color palette inspired by [brand/concept]. Include semantic colors for success, warning, error states.
```
**Hero Sections:**
```
Create a hero section with a diagonal split layout, bold headline on the left, and product screenshot on the right.
```
```
Design a full-screen hero with animated gradient background, centered headline with letter-by-letter animation.
```
#### 🧭 Impeccable Frontend Craft (impeccable)
The `impeccable` skill adds a structured frontend design workflow for shaping, critique, audits, polish passes, live iteration, and end-to-end craft work. It is pinned to `skill-v3.0.7` from `pbakaus/impeccable`.
**Shape Before Build:**
```
Use impeccable shape for this onboarding flow before implementation. Resolve layout, tone, interaction states, and responsive behavior.
```
```
Run impeccable craft for this landing page and wait for the shape brief before editing files.
```
**Critique And Polish:**
```
Use impeccable critique on this dashboard. Prioritize visual hierarchy, cognitive load, accessibility, and interaction clarity.
```
```
Use impeccable polish on this settings UI before release. Tighten spacing, copy, empty states, errors, and mobile behavior.
```
**Live UI Iteration:**
```
Use impeccable live to inspect the current page in-browser and propose stronger variants for the selected UI elements.
```
```
Build a hero with parallax scrolling, floating UI elements, and a CTA that pulses subtly.
```
**Component Design:**
```
Create a pricing card with glass morphism effect, gradient border, and hover animation that lifts the card.
```
```
Design a testimonial carousel with asymmetric cards, large quotation marks, and smooth slide transitions.
```
```
Build a feature grid with icons that animate on hover, subtle shadows, and a staggered reveal animation.
```
**Motion & Animation:**
```
Add micro-interactions to my buttons: subtle scale on hover, satisfying click feedback, loading state animation.
```
```
Create a page transition effect with content that slides up and fades in as you scroll.
```
```
Design a navigation menu that morphs smoothly between mobile hamburger and desktop horizontal layout.
```
**Background Effects:**
```
Create a gradient mesh background using CSS that subtly animates and shifts colors.
```
```
Add a noise texture overlay to my dark sections for visual depth without looking dated.
```
```
Build an animated blob background that responds to mouse movement.
```
**Anti-AI-Slop Audit:**
```
Review my landing page for generic AI patterns. Check for: overused fonts, stock gradients, predictable layouts, bland copy.
```
```
Make this hero section more distinctive. It currently looks like every other SaaS landing page.
```
```
Audit my design for "AI slop" indicators and suggest specific improvements for each issue.
```
---
#### ♿ Web Accessibility Review & Implementation (web-design-guidelines + web-platform-design)
Use `web-design-guidelines` for review findings and compliance audits. Use `web-platform-design` when you want accessible patterns implemented in code.
**Color & Contrast (`web-design-guidelines`):**
```
Check all text colors in my CSS for WCAG AA contrast compliance (4.5:1 for normal text, 3:1 for large text).
```
```
My brand color is #3B82F6. What's the minimum darkness needed for text on white background to pass WCAG AA?
```
```
Review my color palette for colorblind accessibility. Suggest alternatives for red/green combinations.
```
**Focus States (`web-platform-design`):**
```
Audit my interactive elements for visible focus indicators. Show me how to add proper focus-visible styles.
```
```
My designer wants to remove focus outlines. Create accessible alternatives that still look good.
```
```
Add a skip link to my page header that becomes visible on focus.
```
**Form Accessibility (`web-platform-design`):**
```
Review my form for accessibility issues: labels, error messages, required field indicators, and field grouping.
```
```
Make this form accessible: add proper labels, aria-describedby for help text, and live error announcements.
```
```
Create an accessible date picker pattern with keyboard navigation and screen reader support.
```
**Semantic HTML (`web-design-guidelines`):**
```
Audit my page structure for semantic HTML issues. Check heading hierarchy, landmarks, and proper element usage.
```
```
Convert this div-soup navigation to proper semantic HTML with nav, ul, li, and a elements.
```
```
Review my table markup. Add proper headers, scope attributes, and caption for accessibility.
```
**ARIA Patterns (`web-platform-design`):**
```
Implement an accessible modal dialog with proper focus trapping, escape key handling, and aria attributes.
```
```
Create accessible tabs with proper ARIA roles, keyboard navigation (arrow keys), and focus management.
```
```
Build an accessible accordion using details/summary with enhanced keyboard support and animations.
```
```
Add ARIA live regions to my notification system so screen readers announce new messages.
```
**Keyboard Navigation (`web-design-guidelines` + `web-platform-design`):**
```
Audit my page for keyboard accessibility. Check tab order, focus traps, and interactive element reachability.
```
```
My dropdown menu isn't keyboard accessible. Fix the tab order and add arrow key navigation.
```
```
Create a keyboard-navigable image gallery with arrow keys, escape to close, and focus restoration.
```
**Screen Reader Testing (`web-design-guidelines`):**
```
What will a screen reader announce for this component? Check all interactive elements and dynamic content.
```
```
Add proper alt text to my images. Some are decorative, some are informational, some are functional.
```
```
Review my icon buttons. They need accessible names since they have no visible text.
```
**Responsive & Touch (`web-platform-design`):**
```
Audit my touch targets for mobile accessibility. Minimum 44x44px with adequate spacing.
```
```
Check my