# Tools

> Every listed resource, editors’ picks first. The filters below can be combined.

- Search: append `?q=<keywords>` to the URL. Separate several keywords with spaces; all of them must match. Matches name, repository, tags, professions, description and README.
- Filter by type: append `?type=<cli|skill|plugin|mcp>` to the URL.
- Filter by profession: append `?profession=<profession id>` to the URL. Separate several ids with commas; a resource matches when it suits any of them. Ids are listed at https://hebbmind.com/api/v1/professions
- Filter by tag: append `?tag=<tag>` to the URL. Separate several tags with commas; a resource must carry all of them. Tags are listed at https://hebbmind.com/api/v1/tags

Resources for Full-stack / Indie or Frontend or ML / AI or Data engineering or Security: 931 items.

> - Full-stack / Indie: General software work: coding-agent workflows, code review, debugging and Git collaboration.
> - Frontend: Web and mobile-web interfaces: building, debugging and performance tuning.
> - ML / AI: Model training, evaluation and LLM application development.
> - Data engineering: Data pipelines, warehouse modeling, ETL and data quality.
> - Security: Code audits, vulnerability triage, penetration testing and compliance.

- [Pinecone Plugin for Claude Code](https://hebbmind.com/ja/plugin/pinecone-claude-code-plugin.md): [Plugin] Pinecone's official plugin: bundles the Pinecone MCP server and /pinecone skill commands to create vector indexes, upsert data, search in plain language, or build a document Q&A assistant with citations from Claude Code. Needs a Pinecone API key (free sign-up); Assistant features also need uv.
- [Audit Design System](https://hebbmind.com/ja/skill/audit-design-system.md): [Skill] Audits a Figma screen or component for design-system drift, read-only: shared primitives rebuilt as plain frames, hard-coded values instead of variables, and variant drift. Each finding cites structural evidence and may suggest a replacement. Outputs Markdown or JSON; needs Figma MCP.
- [Vault MCP Server](https://hebbmind.com/ja/mcp/vault-mcp-server.md): [MCP] HashiCorp's official MCP: lets agents manage Vault mounts, read and write KV secrets, enable PKI, create issuers and roles, and issue certificates. Needs a reachable Vault server and token; HashiCorp recommends using it only in trusted local environments.
- [ASCII Animation](https://hebbmind.com/ja/skill/ascii-animation.md): [Skill] Builds animations out of text characters: brightness-ramp mapping with cell aspect correction, generative ASCII fields, image, video and Three.js scene to ASCII conversion, and terminal intros or loaders, rendered with <pre>, canvas or ANSI output.
- [Accessible Animation](https://hebbmind.com/ja/skill/accessible-animation.md): [Skill] Applies tiered prefers-reduced-motion handling instead of disabling everything: removes vestibular triggers like parallax and scroll hijacking, softens large movement into short fades, and keeps essential motion. Covers CSS and JS gating for GSAP, Framer Motion and Lenis, per WCAG 2.3.3.
- [GSAP Web](https://hebbmind.com/ja/skill/gsap-web.md): [Skill] Guides code-driven web motion with GSAP: timelines, ScrollTrigger pinning and scrubbing, horizontal scroll sections, SplitText reveals, Flip layout transitions, and syncing with Lenis or Locomotive smooth scroll to avoid jitter and broken pins.
- [Glassmorphism](https://hebbmind.com/ja/skill/glassmorphism.md): [Skill] Builds frosted and liquid-glass UI: backdrop-filter blur, translucent fills, bright edge highlights and layered shadows, SVG displacement for refraction, hover, scroll and entrance motion, plus accessible reduced-transparency fallbacks.
- [Lottie Animation](https://hebbmind.com/ja/skill/lottie-animation.md): [Skill] Integrates Lottie and dotLottie animations from After Effects into web, iOS, Android and React Native: playback and segment control, scroll- or hover-driven interactivity, runtime theming and recoloring, plus an After Effects export checklist.
- [Micro Interaction](https://hebbmind.com/ja/skill/micro-interaction.md): [Skill] Adds functional UI micro-interactions with Framer Motion (motion/react) and modern CSS: hover and press feedback, toggles, toasts, drawers, modals, list reorder and shared-element transitions, with 100-250ms timings, asymmetric enter and exit easing, and reduced-motion support.
- [Page Transition Animation](https://hebbmind.com/ja/skill/page-transition-animation.md): [Skill] Implements page and route transitions in the Next.js App Router and fixes Framer Motion exit animations that never fire on navigation, using template.tsx with a pathname-keyed AnimatePresence and FrozenRouter, or the View Transitions API via next-view-transitions.
- [SVG Animation](https://hebbmind.com/ja/skill/svg-animation.md): [Skill] Animates SVG with stroke draw-on effects, path morphing via GSAP MorphSVG or Flubber, motion along a path, animated icon state changes, and gradient or filter animation, choosing between CSS, SMIL and GSAP per task.
- [60fps Animation](https://hebbmind.com/ja/skill/60fps-animation.md): [Skill] Fixes janky web animation by moving width, height, position and box-shadow animations onto compositor-only transform and opacity, using pseudo-element opacity for shadows and the FLIP technique for layout changes and height: auto, to reach smooth 60/120fps motion.
- [Trivy MCP Server](https://hebbmind.com/ja/mcp/trivy-mcp.md): [MCP] Trivy's MCP plugin: lets agents scan local projects, container images and remote repositories for vulnerabilities and misconfigurations in plain language, optionally checking policy compliance via the Aqua platform. Requires Trivy; maintained by Aqua Security.
- [Auth0](https://hebbmind.com/ja/plugin/auth0.md): [Plugin] Helps agents add Auth0 authentication to apps: detects 35+ frameworks and covers login, MFA, SSO, RBAC, JWT validation, migration from other auth providers, and tenant security audits. Maintained by Auth0; needs an Auth0 account (free sign-up).
- [Alibaba Cloud DataWorks MCP Server](https://hebbmind.com/ja/mcp/alibabacloud-dataworks-mcp-server.md): [MCP] Alibaba Cloud's official MCP server: through the DataWorks Open API, agents manage data development nodes and workflows, operate scheduled instances, query Data Map metadata and lineage, and configure data quality rules. Needs an Alibaba Cloud AccessKey.
- [DeepL CLI](https://hebbmind.com/ja/cli/deepl-cli.md): [CLI] DeepL's official CLI: translate text and PDF, Word, PowerPoint and Excel documents while keeping formatting, with glossaries and translation memory. Needs a DeepL API key (free plan available); install from source with Node.js 24.15+. Have legal translations reviewed.
- [Paddle MCP Server](https://hebbmind.com/ja/mcp/paddle-mcp-server.md): [MCP] Official MCP for Paddle, the merchant of record: manage products and prices, customers, subscriptions, transactions and refunds from chat, download invoice PDFs and generate financial reports. Needs a Paddle Billing account and API key; start in sandbox with read-only or non-destructive tools.
- [Phrase Strings CLI](https://hebbmind.com/ja/cli/phrase-cli.md): [CLI] Phrase Strings' official CLI: phrase init walks you through config, then phrase push uploads language files and phrase pull fetches the latest translations; it also wraps the full API for projects, locales and keys. Needs a Phrase Strings account (paid, 14-day free trial) and an API token.
- [Netlify Skills](https://hebbmind.com/ja/plugin/context-and-tools.md): [Plugin] Netlify's official plugin with skills for Functions, Edge Functions, Blobs, databases, forms, caching, netlify.toml configuration and deploys, plus the hosted Netlify MCP (OAuth sign-in on first use).
- [Weblate Client (wlc)](https://hebbmind.com/ja/cli/wlc.md): [CLI] Official CLI for Weblate, the open-source translation platform: check translation progress for projects and components, upload and download translation files, lock components, and commit or push repository changes. Hosted or self-hosted; needs the server URL, an API key and Python.
- [Transitions.dev](https://hebbmind.com/ja/skill/transitions-dev.md): [Skill] Provides twelve drop-in CSS transitions, including card resize, number pop-in, badges, dropdowns, modals, panel reveals, page slides, icon swaps, success checks and error shakes, configured through shared CSS custom properties with no framework dependency and reduced-motion guards.
- [12 Principles of Animation](https://hebbmind.com/ja/skill/12-principles-of-animation.md): [Skill] Audits animation code against Disney's 12 principles adapted for the web, checking timing, easing, physics and staging rules such as user-initiated motion under 300ms and ease-out entrances, and reports findings as file:line.
- [Generating Sounds with AI](https://hebbmind.com/ja/skill/generating-sounds-with-ai.md): [Skill] Audits Web Audio API code for procedural UI sound synthesis: reusing one AudioContext, resuming when suspended, disconnecting nodes, exponential decay envelopes, noise for clicks and parameter choices, with findings reported as file:line.
- [Mastering AnimatePresence](https://hebbmind.com/ja/skill/mastering-animate-presence.md): [Skill] Audits Motion (Framer Motion) code against AnimatePresence rules: wrapping conditional exits, exit props and keys, the useIsPresent and usePresence hooks, choosing a mode, and coordinating nested exits. Reports findings as file:line. For React projects.
- [Morphing Icons](https://hebbmind.com/ja/skill/morphing-icons.md): [Skill] Guides the agent in building SVG icon components that morph between any two icons by moving lines instead of crossfading. Every icon uses exactly three lines, unused ones collapse to the center, and grouped variants rotate with springs. Examples use React and Motion and respect reduced motion.
- [Pseudo Elements](https://hebbmind.com/ja/skill/pseudo-elements.md): [Skill] Audits CSS and JavaScript for pseudo-element and View Transitions API practices: content, positioning and z-index of ::before and ::after, replacing extra DOM nodes, expanding hit targets, naming and cleaning up view-transition-name, and ::backdrop styling. Reports findings as file:line.
- [Sounds on the Web](https://hebbmind.com/ja/skill/sounds-on-the-web.md): [Skill] Audits UI code for audio feedback: every sound needs a visual equivalent, an off switch and volume control, and should respect reduced motion. Sound is for confirmations and errors, not typing or decorative hovers. Also checks preloading, default volume and sound weight. Reports file:line findings.
- [To Spring or Not to Spring](https://hebbmind.com/ja/skill/to-spring-or-not-to-spring.md): [Skill] Audits animation code for the right timing function: springs for gestures and interruptible motion, easing for system-driven state changes, linear for progress, and no animation for high-frequency interactions. Also checks spring parameters and durations. Reports file:line findings.
- [GitGuardian MCP Server](https://hebbmind.com/ja/mcp/ggmcp.md): [MCP] GitGuardian's official MCP: scans code for leaked secrets with 500+ detectors, and lets agents triage and remediate incidents, generate honeytokens and open fix PRs. Needs a GitGuardian account; the hosted endpoint with OAuth sign-in is recommended.
- [Postman Plugin for Claude Code](https://hebbmind.com/ja/plugin/postman-claude-code-plugin.md): [Plugin] Postman's official plugin: sets up the Postman MCP server so Claude Code can sync collections, run API tests and diagnose failures, generate client code, create mocks and docs, and run OWASP API security checks. Needs a Postman account.
- [Snowflake Cortex Code](https://hebbmind.com/ja/plugin/cortex-code.md): [Plugin] Snowflake's official plugin: detects Snowflake-related requests and hands them to the Cortex Code CLI, whose 55+ built-in skills handle SQL, dynamic tables, data governance and more. Needs the cortex CLI installed and a Snowflake connection configured.
- [Tencent Cloud COS MCP Server](https://hebbmind.com/ja/mcp/cos-mcp.md): [MCP] Lets agents upload, download and list files in Tencent Cloud Object Storage (COS), and use Cloud Infinite for image processing, QR code recognition, document-to-PDF conversion, video frame capture and natural-language search. Maintained by Tencent Cloud; needs a SecretId and SecretKey.
- [Supabase Agent Plugin](https://hebbmind.com/ja/plugin/supabase-plugin.md): [Plugin] Supabase's official plugin: Supabase and Postgres best-practice skills plus the Supabase remote MCP to manage projects, run SQL, design schemas and RLS policies, and handle auth and storage. Needs a Supabase account.
- [Compact Landing](https://hebbmind.com/ja/skill/compact-landing.md): [Skill] Builds compact, polished landing pages for dev tools, package demos and micro-SaaS. Picks a design fingerprint (composition, palette, type, radius, surfaces, motion) so each run looks different, features a product-native demo, and keeps zero layout shift, focus states and reduced motion.
- [Budge](https://hebbmind.com/ja/skill/budge.md): [Skill] When the agent changes a single CSS value or Tailwind class in a Next.js App Router project, a floating bar appears on the page so you can fine-tune it with arrow keys before persisting. Loads a runtime script from budge.design in app/layout.tsx.
- [Interactive Hit Areas](https://hebbmind.com/ja/skill/interactive-hit-areas.md): [Skill] Fixes hover and click dead zones between spaced interactive elements such as chart bars, list rows, tabs and nav items by making hit targets flush and moving visual spacing inside each item, with React and Tailwind examples.
- [Paper Flex](https://hebbmind.com/ja/skill/paper-flex.md): [Skill] Converts absolutely positioned Paper canvas nodes to flex layout through Paper MCP: computes spacing from computed styles, preserves SVGs and images via x-paper-clone, fixes z-order and shadows, and verifies with screenshot comparison.
- [Paper to Code Components](https://hebbmind.com/ja/skill/paper-to-code-components.md): [Skill] Turns Paper designs (via Paper MCP, Viewfinder or exported JSX) into componentized React/Next.js code: maps hierarchy and reusable components first, one component per icon, tokens in globals.css, shadcn reuse, real fonts and data-driven charts.
- [Reconcile Paper Sync](https://hebbmind.com/ja/skill/reconcile-paper-sync.md): [Skill] Verifies and repairs a Paper-derived app against its local paper-sync render: ports the real fonts, reads exact type, color and decoration values from the canonical export, screenshot-diffs the running app against the frame and separates conversion drift from newer design.
- [Tailwind Token Consolidation](https://hebbmind.com/ja/skill/tailwind-token-consolidation.md): [Skill] Reduces CSS custom properties and Tailwind v4 design tokens in globals.css without changing visuals: maps usage to find live tokens, deletes dead ones, collapses values similar in light and dark modes via a scripted rename map, and verifies with typecheck, lint and build.
- [Tolgee CLI](https://hebbmind.com/ja/cli/tolgee-cli.md): [CLI] Official CLI for Tolgee, the open-source localization platform: extract strings from code, push keys to Tolgee and pull the latest translations, and diff local files against the platform. Works with Tolgee Cloud or self-hosted; needs Node.js 18+ and a personal or project API key (tolgee login).
- [CC Figma Component](https://hebbmind.com/ja/skill/cc-figma-component.md): [Skill] Reads a component-contracts contract JSON, derives component-scoped tokens and builds a fully variable-bound Figma component set with all variants. Requires cc-figma-tokens to have run first, plus the figma-use and figma-generate-library skills.
- [CC Figma Tokens](https://hebbmind.com/ja/skill/cc-figma-tokens.md): [Skill] Syncs component-contracts token files in W3C DTCG format into native Figma variables, building Primitives and Semantic collections with role-based scopes and web code syntax after you approve a plan. Prerequisite for cc-figma-component.
- [Langfuse Observability Plugin](https://hebbmind.com/ja/plugin/claude-observability-plugin.md): [Plugin] Langfuse's official plugin: uses hooks to send prompts, model calls, token usage and cost, tool calls and subagents from Claude Code sessions to Langfuse as traces for monitoring and review. Needs Langfuse keys (self-hosting supported) and uv or Python 3.10+.
- [Sync Figma Token](https://hebbmind.com/ja/skill/sync-figma-token.md): [Skill] Syncs design tokens between code and Figma variables: normalizes both sides, reports drift by value, alias, mode and scope in a dry run, then stops for explicit approval before writing, archives rather than deletes, and saves JSON reports. Requires the Figma MCP server; invoked manually.
- [Product Launch Video](https://hebbmind.com/ja/skill/product-launch-video.md): [Skill] Builds product launch, promo and feature announcement videos with Remotion (React): asks nine questions about product, audience, duration, voiceover and channel, proposes 2-3 visual directions, writes a storyboard.json, then codes scenes and optional voiceover.
- [Browser Use](https://hebbmind.com/ja/plugin/browser-use.md): [Plugin] Browser Use's official plugin: connects the Browser Use MCP so Claude can drive your local Chrome or a cloud browser to browse, extract data, fill forms, test sites and take screenshots. Needs uv; cloud browsers need sign-in or an API key.
- [AWS Startup Advisor](https://hebbmind.com/ja/plugin/aws-startup-advisor.md): [Plugin] AWS's official plugin for startups: answers AWS Activate credit eligibility and 60+ startup perks, gives architecture and cost advice by funding stage, team size and runway, and plans migrations from GCP, Azure or Heroku. Perk lookups need no AWS account; migrations need your repo.
- [ModelScope MCP Server](https://hebbmind.com/ja/mcp/modelscope-modelscope-mcp-server.md): [MCP] ModelScope's official MCP: search models, datasets, Studio apps, papers and MCP servers and view details, plus text-to-image and image-to-image generation. Needs a ModelScope API token.
- [Weblate MCP Server](https://hebbmind.com/ja/mcp/weblate-mcp.md): [MCP] Community MCP for Weblate, the open-source translation platform (self-hosted or hosted): translators can find untranslated or needs-editing strings in plain language, write translations in bulk, and check per-language progress and change history. Needs your Weblate API URL and token, and Node.js.

Next page: https://hebbmind.com/ja/tools.md?page=19&profession=fullstack%2Cfrontend%2Calgorithm%2Cdata-engineering%2Csecurity
