milodule3-debug
UserModel-agnostic autonomous coding agent with a reproducible benchmark harness, adaptive turn budgets, and domain-expert prompting. Works with Claude, GPT, Gemini, MiMo, Zhipu/GLM, Ollama, OpenCode Go. 1380+ tests. Built by AI agents, orchestrated by humans. MIT licensed.
Categories
Indexed Skills (47)
accesslint-audit
Find and fix WCAG 2.2 accessibility issues. Two modes — report (sweep a codebase or page, produce a prioritized written report, no edits) and fix (audit→edit→verify loop on a target). Prefers direct-CDP live-DOM auditing; falls back to HTML-string audits.
accesslint-diff
Diff a live page's accessibility violations against a baseline — by default compares uncommitted changes (stash-based), or pass --branch [<name>] to diff against a branch. Reports only new violations introduced, violations fixed, and pre-existing count. Use `scan` for a full audit with no diffing.
frontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
theme-factory
Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors/fonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.
webapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
remove-auth-from-electron-react-app
Systematically remove Firebase auth & cloud sync from an Electron + React app — trace dependencies across renderer, main process, and preload bridge
silent-require-failure-in-electron-ai
When Electron main-process AI features fail with "Offline" despite valid API keys, check whether the `openai` npm package is installed — a silent `require('openai')` inside try/catch returns null and masks the real cause
tailwind-css-variable-theme-removal-causes-white-inputs
When removing CSS custom property theme tokens (RGB channels) from a Tailwind project, input fields become white-on-white — text and background both render as white because the CSS variables resolve to empty
prism-glass-pro-redesign
Complete procedure for applying Prism Glass Pro glassmorphism theme to a Tailwind/React/Electron app
agentic
Conversational AI-first interface with minimal controls, clear outcomes, and delegated task flows for agentic workflows.
ant
Structured, enterprise-focused design system emphasizing clarity, consistency, and efficiency for data-dense web applications.
application
App dashboard with purple-themed aesthetic, top-bar navigation, card-based layouts, and developer-first workflows.
artistic
High-contrast, expressive style with creative typography and bold color choices for visually striking interfaces.
bento
Modular grid layout with card-like blocks, clear hierarchy, soft spacing, and subtle visual contrast for organized, scannable interfaces.
bold
Strong visual presence with heavyweight typography, high-contrast colors, and commanding layouts.
brutalism
Raw, anti-design aesthetic inspired by concrete architecture with unadorned elements, jarring layouts, and functional minimalism.
cafe
Cozy cafe-inspired interface with warm tones, soft typography, and clean layouts for a relaxed browsing experience.
claude
A research-journal aesthetic printed on warm stone — authoritative, editorial, almost achromatic. Pages live on warm ivory parchment (never pure white), with near-black slate as the dominant ink.
claymorphism
Soft, rounded 3D-like shapes mimicking malleable clay with playful, puffy elements and colorful surfaces.
clean
Simplicity-focused design with ample whitespace, legible typography, and a limited color palette to reduce visual clutter.
codex
A radically minimal, blank-canvas interface built as a pure edge-to-edge surface, with almost no color and typography carrying the visual weight. Black serves as the only filled color, the only divider, and the sole surface tone cards.
colorful
Vibrant, high-contrast palettes and gradients for engaging, memorable, and modern user experiences.
contemporary
Current-era minimalist design with bento grids, dark mode support, and high-performance accessible layouts.
corporate
Professional, brand-aligned design with structured grids, minimalist layouts, and consistent enterprise patterns.
cosmic
Futuristic sci-fi aesthetic with dark themes, vibrant neon accents, and immersive spatial elements.
creative
Playful, character-driven design with expressive typography and bold graphics for landing pages and creative projects.
accesslint-scan
Audit a live page for accessibility issues and locate each violation precisely — pass a URL, a config target name (e.g. `accesslint:scan dev`), or nothing to use the default target from accesslint.config.json. Ensures a debuggable Chrome, runs the @accesslint/core engine via CDP, and returns a worklist of live-DOM WCAG violations grounded to each violation's DOM selector and source file:line. Locates; doesn't edit — output drives fixes by Claude. Use it for "is this page accessible", or to verify a UI change. For diffing against uncommitted changes or a branch, use the `diff` skill.
electron-ai-key-silent-fail
Diagnose when AI features silently return 'Offline' or 'no API key' despite valid settings
isnative-boolean-called-as-function
When a utility exports a boolean constant but a component imports and calls it as a function — `isNative()` instead of `isNative` — causes "is not a function" at render time
animejs
Anime.js adapter patterns for HyperFrames. Use when writing Anime.js animations or timelines inside HyperFrames compositions, registering animations on window.__hfAnime, making Anime.js seek-driven and deterministic, or translating Anime.js examples into render-safe HyperFrames HTML.
antv-s2-expert
S2 multi-dimensional cross-analysis table development assistant (Expert Skill). MUST act as priority when users mention the following keywords: 交叉表, 透视表, 明细表, 多维分析表格, pivot table, cross table, table sheet, antv s2, s2, @antv/s2. Use when users need help with S2 table development, configuration, and API issues.
chart-visualization
将数据可视化为图表。当用户需要生成柱状图、折线图、饼图、散点图、雷达图、桑基图、思维导图、流程图等图表时调用此技能,通过 curl 工具调用 AntV API 生成图表图片
contribute-catalog
Author a new HyperFrames registry block (caption style, VFX block, transition, lower third) or component (text effect, overlay, snippet) and ship it as an upstream PR to the hyperframes repo. Use ONLY when the user wants to CONTRIBUTE to the public catalog — for in-project caption/transition authoring use the `hyperframes` skill, for installing existing registry items use the `hyperframes-registry` skill.
css-animations
CSS animation adapter patterns for HyperFrames. Use when authoring CSS keyframes, animation-delay based timing, animation-fill-mode, animation-play-state, or CSS-only motion that HyperFrames must seek deterministically during preview and rendering.
gsap
GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.
hyperframes-cli
HyperFrames CLI dev loop — `npx hyperframes` for scaffolding (init), validation (lint, inspect), preview, render, and environment troubleshooting (doctor, browser, info, upgrade). Use when running any of these commands or troubleshooting the HyperFrames build/render environment. For asset preprocessing commands (`tts`, `transcribe`, `remove-background`), invoke the `hyperframes-media` skill instead.
hyperframes-media
Asset preprocessing for HyperFrames compositions — text-to-speech narration (Kokoro), audio/video transcription (Whisper), and background removal for transparent overlays (u2net). Use when generating voiceover from text, transcribing speech for captions, removing the background from a video or image to use as a transparent overlay, choosing a TTS voice or whisper model, or chaining these (TTS → transcribe → captions). Each command downloads its own model on first run.
hyperframes-registry
Install and wire registry blocks and components into HyperFrames compositions. Use when running hyperframes add, installing a block or component, wiring an installed item into index.html, or working with hyperframes.json. Covers the add command, install locations, block sub-composition wiring, component snippet merging, and registry discovery.
hyperframes
Create video compositions, animations, title cards, overlays, captions, voiceovers, audio-reactive visuals, and scene transitions in HyperFrames HTML. Use when asked to build any HTML-based video content, add captions or subtitles synced to audio, generate text-to-speech narration, create audio-reactive animation (beat sync, glow, pulse driven by music), add animated text highlighting (marker sweeps, hand-drawn circles, burst lines, scribble, sketchout), or add transitions between scenes (crossfades, wipes, reveals, shader transitions). Covers composition authoring, timing, media, and the full video production workflow. For dev-loop CLI commands (init, lint, inspect, preview, render) see the hyperframes-cli skill; for asset preprocessing commands (tts, transcribe, remove-background) see the hyperframes-media skill.
infographic-creator
Create beautiful infographics based on given text content. Use when users request to create infographics.
lottie
Lottie and dotLottie adapter patterns for HyperFrames. Use when embedding lottie-web JSON animations, .lottie files, @lottiefiles/dotlottie-web players, registering instances on window.__hfLottie, or making After Effects exports deterministic in HyperFrames.
remotion-to-hyperframes
Translate an existing Remotion (React-based) video composition into a HyperFrames HTML composition. Use ONLY when the user explicitly asks to port, convert, migrate, translate, or rewrite a Remotion composition as HyperFrames (e.g. "port my Remotion project to HyperFrames"). Do NOT use when (a) authoring a NEW HyperFrames composition (even if A/B-testing a Remotion video); (b) Remotion is mentioned in passing; (c) Remotion code is shared as reference, not for translation; (d) the user wants "the same video as my Remotion one" without explicitly asking to migrate the source — treat as a fresh HyperFrames build. When in doubt, default to the `hyperframes` skill. Detects unsupported patterns (useState, useEffect side effects, async calculateMetadata, third-party React component libraries, `@remotion/lambda`) and recommends the runtime interop escape hatch instead of a lossy translation.
tailwind
Tailwind CSS v4.2 browser-runtime patterns for HyperFrames compositions. Use when scaffolding or editing projects created with `hyperframes init --tailwind`, writing Tailwind utility classes in composition HTML, adding CSS-first Tailwind v4 theme tokens, debugging v3 vs v4 syntax, or deciding when to compile Tailwind to CSS instead of using the browser runtime.
three
Three.js and WebGL adapter patterns for HyperFrames. Use when creating deterministic Three.js scenes, WebGL canvas layers, AnimationMixer timelines, camera motion, shader-driven visuals, or canvas renders that respond to HyperFrames hf-seek events.
typegpu
TypeGPU and raw WebGPU adapter patterns for HyperFrames. Use when creating GPU-rendered compositions with TypeGPU, raw WebGPU, WGSL fragment shaders, compute pipelines, liquid glass effects, particle systems, or any canvas layer driven by navigator.gpu that responds to HyperFrames hf-seek events.
waapi
Web Animations API adapter patterns for HyperFrames. Use when authoring element.animate() motion, Animation currentTime seeking, document.getAnimations(), KeyframeEffect timing, fill modes, or native browser animations that must render deterministically in HyperFrames.
website-to-hyperframes
Capture a website and create a HyperFrames video from it. Use when: (1) a user provides a URL and wants a video, (2) someone says "capture this site", "turn this into a video", "make a promo from my site", (3) the user wants a social ad, product tour, or any video based on an existing website, (4) the user shares a link and asks for any kind of video content. Even if the user just pastes a URL — this is the skill to use.
Bio shown is the top-scored skill's repo description as a fallback — real GitHub bios land in a future update.