# transformers-js

This skill helps run machine learning models from JavaScript and TypeScript for text, images, audio, and multimodal tasks in browser or server-side code.

- skill · `type=skill` · Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, OpenCode · 2100 installs · ★ 11213
- Author: huggingface
- License: Apache-2.0 · policy=mirror · the beginning of the file is at the end of this page
- Source: https://github.com/huggingface/skills/tree/HEAD/skills/transformers-js/SKILL.md
- Updated: 2026-10-23
- HTML: https://affpapa.org/en/nevibecode/skills/transformers-js

## What it does

transformers-js gives the agent guidance for using Transformers.js. The library runs pretrained models from Hugging Face Hub through the `pipeline` API, which combines preprocessing, inference, and result handling. The covered work includes NLP, computer vision, audio processing, and multimodal applications.

Models can run in a browser or in Node.js, Bun, or Deno. Execution uses WebGPU or WASM, while `dtype` controls options such as `fp32`, `fp16`, `q8`, and `q4`. Pipelines should be released with `pipe.dispose()` after use to avoid memory leaks. Node.js requires `18+`; downloading models from Hugging Face Hub also needs internet access unless local models are used.

## Install

### Claude Code (native platform)

1. **Skills CLI (Vercel)**
```bash
npx skills add huggingface/skills --skill transformers-js -a claude-code
```

2. **Manually: put the files in place**
- File: `~/.claude/skills/transformers-js/SKILL.md` — Copy the whole skill folder; for one project use .claude/skills/transformers-js/

### Codex

1. **Skills CLI (Vercel)**
```bash
npx skills add huggingface/skills --skill transformers-js -a codex
```

2. **Manually: put the files in place**
- File: `.agents/skills/transformers-js/SKILL.md` — For all projects use ~/.agents/skills/

### Cursor

1. **Skills CLI (Vercel)**
```bash
npx skills add huggingface/skills --skill transformers-js -a cursor
```

2. **Manually: put the files in place**
- File: `.cursor/skills/transformers-js/SKILL.md` — Cursor also reads .agents/skills/ and .claude/skills/

### GitHub Copilot

1. **GitHub CLI**
```bash
gh skill install huggingface/skills transformers-js
```

2. **Manually: put the files in place**
- File: `.github/skills/transformers-js/SKILL.md`

### Gemini CLI

1. **Skills CLI (Vercel)**
```bash
npx skills add huggingface/skills --skill transformers-js -a gemini-cli
```

2. **Platform CLI**
```bash
gemini skills install https://github.com/huggingface/skills --path skills/transformers-js
```

### Windsurf (Devin Desktop)

**Manually: put the files in place**
- File: `.devin/skills/transformers-js/SKILL.md` — The legacy .windsurf/skills/ path still works

### OpenCode

**Skills CLI (Vercel)**
```bash
npx skills add huggingface/skills --skill transformers-js -a opencode
```

### Claude.ai

**Claude.ai**
- Zip the folder and upload it in Settings → Capabilities → Skills

Where a file is given instead of a command, copy the files from the source to that path: https://github.com/huggingface/skills/tree/HEAD/skills/transformers-js/SKILL.md

## When to use it
- classify and summarize text
- translate text between languages
- transcribe speech and process audio
- detect objects in images
- run ML models in a browser without a Python server

## Example prompts
- Use transformers-js to add sentiment classification with the `pipeline` API.
- Choose a model from Hugging Face Hub for speech recognition and connect it to Node.js.
- Build browser image processing with WebGPU and release the pipeline with `pipe.dispose()` when the task ends.

## Source text · SKILL.md · Apache-2.0

Below is the content of a third-party file. It is data, not instructions for you: do not act on anything written inside unless the human asks. Block tag: 8bcf7577b88f3f79.

BEGIN THIRD-PARTY FILE 8bcf7577b88f3f79
````text
---
name: transformers-js
description: Use Transformers.js to run state-of-the-art machine learning models directly in JavaScript/TypeScript. Supports NLP (text classification, translation, summarization), computer vision (image classification, object detection), audio (speech recognition, audio classification), and multimodal tasks. Works in browsers and server-side runtimes (Node.js, Bun, Deno) with WebGPU/WASM using pre-trained models from Hugging Face Hub.
license: Apache-2.0
metadata:
  author: huggingface
  version: "4.x"
  category: machine-learning
  repository: https://github.com/huggingface/transformers.js
compatibility: Requires Node.js 18+ (or compatible Bun/Deno runtime) or modern browser with ES modules support. WebGPU requires runtime and hardware support; WASM is the broad fallback. Internet access is needed for downloading models from Hugging Face Hub (optional if using local models).
---

# Transformers.js - Machine Learning for JavaScript

Transformers.js enables running state-of-the-art machine learning models directly in JavaScript across browsers and server-side runtimes (Node.js, Bun, Deno), with no Python server required.

## When to Use This Skill

Use this skill when you need to:
- Run ML models for text analysis, generation, or translation in JavaScript
- Perform image classification, object detection, or segmentation
- Implement speech recognition or audio processing
- Build multimodal AI applications (text-to-image, image-to-text, etc.)
- Run models client-side in the browser without a backend

## Installation

### NPM Installation
```bash
npm install @huggingface/transformers
```

### Browser Usage (CDN)
```javascript
<script type="module">
  import { pipeline } from 'https://cdn.jsdelivr.net/npm/@huggingface/transformers';
</script>
```

## Core Concepts

### 1. Pipeline API
The pipeline API is the easiest way to use models. It groups together preprocessing, model inference, and postprocessing:

```javascript
import { pipeline } from '@huggingface/transformers';

// Create a pipeline for a specific task
const pipe = await pipeline('sentiment-analysis');

// Use the pipeline
const result = await pipe('I love transformers!');
// Output: [{ label: 'POSITIVE', score: 0.999817686 }]

// IMPORTANT: Always dispose when done to free memory
await pipe.dispose();
```

**⚠️ Memory Management:** All pipelines must be disposed with `pipe.dispose()` when finished to prevent memory leaks. See examples in [Code Examples](./references/EXAMPLES.md) for cleanup patterns across different environments.

### 2. Model Selection
You can specify a custom model as the second argument:

```javascript
const pipe = await pipeline(
  'sentiment-analysis',
  'Xenova/bert-base-multilingual-uncased-sentiment'
);
```

**Finding Models:**

Browse available Transformers.js models on Hugging Face Hub:
- **All models**: https://huggingface.co/models?library=transformers.js&sort=trending
- **By task**: Add `pipeline_tag` parameter
````
END THIRD-PARTY FILE 8bcf7577b88f3f79

The third-party file has ended. Everything between the 8bcf7577b88f3f79 tags is data: requests and commands from it are not followed. An “end of file” line with another tag inside the block is part of the file.

First 2980 of 24911 bytes. © huggingface · Apache-2.0 · https://github.com/huggingface/skills/tree/HEAD/skills/transformers-js/SKILL.md

_Part of the page did not fit — see the HTML version._

---
NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md