190 tagged canvas, measured the same way as everything else here.
Browse within: webgpu 49drawing 46no-code 32postgresql 32supabase 32whiteboard 28diagram 27infinite 27sketch 27aigc 25free 25open 25seedance-2 25sora2 25
Skill Claude CodeCodex
This skill should be used when the user asks to "add MCP App support to my web app", "turn my web app into a hybrid MCP App", "make my web page work as an MCP App too", "wrap my existing UI as an MCP App", "convert iframe embed to MCP App", "turn my SPA into an MCP App", or needs to add MCP App support to an existing…
Skill Claude CodeCodex
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends an AI agent's capabilities with specialized knowledge, workflows, or tool integrations.
Skill Claude CodeCodex
Migrate a project to a newer version of the tldraw SDK. Use when upgrading tldraw packages, fixing TypeScript errors after a tldraw upgrade, or when the user mentions tldraw migration.
tradingview/lightweight-charts
Skill Claude CodeCodex
Use when working with TradingView's lightweight-charts — creating charts, adding series (Line/Area/Bar/Candlestick/Histogram), configuring time and price scales, streaming realtime or historical data, panes, markers, per-bar/per-point colors, tooltips, coordinate conversion, custom plugins or primitives, non-financial…
Skill Claude CodeCodex
Author SVG figures for Grida docs — diff-able, version-controlled vector diagrams embedded in doc pages instead of screenshots. Provides reusable primitives (selection chrome, size badges, anchor pins, resize cursors, click ripples), color/typography tokens, a starter template, and finished examples to crib from.…
Skill Claude CodeCodex
Guides performance investigation, benchmarking, and optimization of the Grida Canvas web editor (TypeScript reducer, Immer, React hooks). Use when profiling reducer dispatch cost, diagnosing slow interactions (drag, resize, color change), writing or running editor benchmarks, instrumenting with PerfObserver, or…
Skill Claude CodeCodex
Discipline for the seam between two SDKs (or two sides of one contract) that the same hand writes. The failure mode: "we own both sides" produces dirty contracts no foreign reviewer would accept. The exercise: pretend the other side is FFI, IPC, or a network protocol you cannot rewrite. Spawn an adversarial subagent…
Skill Claude CodeCodex
A coding assistant for VChart, a JavaScript chart library used to build visualizations such as bar, line, and pie charts.
Skill Claude CodeCodex
Sync local files with a Kanwas workspace using the kanwas CLI. Use when the user wants to pull workspace content into the repo, push local edits back, or bulk-import markdown files from disk. Workspaces are trees of markdown notes organized into canvases (directories).
Skill Claude CodeCodex
Edit video with FableCut — assemble a cut, add titles and captions, grade, add transitions, keyframe animation, speed ramps, and export. Use whenever the user wants to cut, trim, caption, subtitle, grade, or otherwise edit a video, or asks to open/start the video editor.
Skill Claude CodeCodex
Analyze a reference video (a reel, montage, or ad the user likes) into an edit blueprint — shot boundaries, music beats, BPM, energy curve, the drop — and rebuild the same structure with the user's own footage. Use when someone says "make it like this video", "remake this reel with my clips", or asks what makes an…
Skill Claude CodeCodex
A commercial visual and user-experience review workflow for websites, product pages, landing pages, and visual assets. It examines clarity, hierarchy, spacing, typography, color, trust signals, conversion paths, and mobile behavior.
Skill Claude CodeCodex
Run a planner -> contract -> build -> evaluator loop for long-running application work using agents-team, task graph, protocol handshakes, and staged worker imports.
Skill Claude CodeCodex
A chapter-based storyboard and video-planning guide for turning stories or scripts into production-ready shot plans. It covers characters, locations, props, camera direction, dialogue, voice-over, subtitles, and short video timelines.
Skill Claude CodeCodex
Adversarial review skill. Use when the user wants to stress-test an idea, argument, proposal, or opinion from multiple independent angles. Spawns parallel Hydra workers with orthogonal analytical methodologies.
Skill Claude CodeCodex
Use when a task should run through Hydra's Lead-driven workflow for multi-agent orchestration, or when an existing workflow must be inspected or cleaned up.
Skill Claude CodeCodex
QA testing skill with real browser automation. Use when asked to "test this site", "QA this page", "check for visual bugs", "verify the deploy", or when Hydra needs browser validation for UI changes. Requires the browse binary.
Skill Claude CodeCodex
Authoritative agent-runtime contract for working inside an OpenKnowledge project — a markdown-CRDT knowledge base exposed over MCP. Use whenever reading, listing, searching, or editing any .md or .mdx file in the project, and before any mcpopen-knowledge tool call (exec, search, write, edit, and the rest). Installed…
Skill Claude CodeCodex
Edit, transform, trim, convert, resize, retime, or analyze video and audio files with ffmpeg/ffprobe on the command line. Use when the user wants to cut or trim a clip, change container/format or codec, scale or crop dimensions, change speed or frame rate, extract or replace or mix audio, concatenate clips, burn in or…
machaomc/refine-canvas-strokes
Skill Claude CodeCodex
Design, implement, review, or troubleshoot safe refinement of editable 2D canvas strokes. Use for handwriting smoothing, automatic text layout cleanup, optional font-guided handwriting normalization, freehand cleanup, geometric shape snapping, diagram cleanup, stroke-style normalization, semantic stroke replacement…
Skill Claude CodeCodex
Manual-invocation only. Five-phase feature loop (audit → ground → fixture → implement → verify) for driving a single SVG feature to Chromium parity in the grida htmlcss::svg renderer. Sibling to dev-render-htmlcss-feature (HTML/CSS path); same loop shape, different corpus (resvg-test-suite + Chrome bake) and different…
Skill Claude CodeCodex
Guides performance optimization work on the Grida Canvas Rust rendering engine (grida crate). Use when asked to benchmark, profile, optimize, or analyze rendering performance — panning, zooming, compositing, caching, culling, or frame budgeting.
Skill Claude CodeCodex
Design, review, and debug visual rendering tests: reftests (independent oracle), golden/snapshot regression tests, probe tests (pixel assertions without vision), SVG reftest suites, and Figma refig suites. Use when adding pixel diffs, choosing an oracle strategy, or comparing renderer output against a ground truth.
Skill Claude CodeCodex
Pilot a spatial canvas from the CLI — create canvases, generate images/text/video/agent responses, read results, recall past work, and manage nodes. The canvas is a shared workspace visible in the browser; this skill gives you a live cursor on it. Use this skill whenever the user wants to interact with the canvas…