clippy-agent

He's back.

The nostalgic desktop assistant, rebuilt for the modern web.
Zero dependencies. TypeScript. All 10 original agents.

$ npm install clippy-agent

View on GitHub Try Live Demo ↓

v2.0.5 · 12KB gzipped · ES Modules · MIT License

Ready

features.exe — Properties

Zero Dependencies

No bloat. No supply chain risk. Pure vanilla JavaScript under the hood.

TypeScript

Full type definitions. IntelliSense and autocomplete in every editor.

10 Agents

All the classics. Clippy, Bonzi, Merlin, and 7 more friends.

ES Modules

Tree-shakeable imports. Works with Vite, Webpack, Rollup, or plain <script>.

100+ Animations

Each agent ships with over 100 unique frame-by-frame animations.

Speech Balloons

Word-by-word animated speech. Just like you remember.

Draggable

Click and drag agents around the screen. Fully interactive.

Sounds

Original sound effects included. Enable or disable per agent.

Available agents:

Clippy Bonzi Merlin Genie Genius Links Peedy Rocky Rover F1

demo.exe

Agent:

Animation:

Click "Load Agent" to start the demo.

No agent loaded

README.md — Notepad

npm / yarn / pnpm

# Install the package npm install clippy-agent

Quick Start

import { load } from 'clippy-agent';
import 'clippy-agent/dist/index.css';

const agent = await load('Clippy');
agent.show();
agent.speak('Hello, World!');
agent.animate();

CDN (No Build Step)

<link rel="stylesheet" href="https://unpkg.com/clippy-agent@2.0.5/dist/index.css">

<script type="module">
  import { load } from 'https://unpkg.com/clippy-agent@2.0.5/dist/index.js';

  const agent = await load('Clippy');
  agent.show();
  agent.speak('Hello from the CDN!');
</script>

API Highlights

// Show with entrance animation
agent.show();

// Speak with word-by-word animation
agent.speak('Need help with that?');

// Play specific animation
agent.play('Wave');

// Random animation
agent.animate();

// Move to coordinates (animated)
agent.moveTo(200, 300);

// All actions are queued automatically
agent.speak('First this...');
agent.play('Thinking');
agent.speak('Then this!');

// Clean up
agent.destroy();

Chrome Extension — clippy-agent

COMING SOON

Clippy for Every Website

Your favorite assistant, everywhere you browse. Context-aware quips for Gmail, GitHub, YouTube, and more.

🌎 Context-Aware Knows what site you're on. Quips about your emails, your code, your videos.

👥 All 10 Agents Pick your companion. Clippy, Bonzi, Merlin, or any of the classics.

⚙ Customizable Control how often your agent speaks. From every 30 seconds to every 5 minutes.

🔌 Lightweight No background processes. No tracking. Just vibes.

Check back soon for Chrome Web Store listing