# clippyjs > Add Clippy or his friends to any website for instant nostalgia. Latest version **0.1.0** (published 2026-02-17) · MIT license · 0 weekly downloads ## Install ```sh npm install clippyjs pnpm add clippyjs yarn add clippyjs bun add clippyjs ``` ## Health **Score 60/100 (C)** — status: stable. Positive: has types; esm support; no vulnerabilities; high quality score. Warnings: low downloads; large bundle; pre 1.0. ## Facts | | | |---|---| | Version | 0.1.0 | | Published | 2026-02-17 | | First published | 2017-06-10 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM | | Dependencies | 0 | | Unpacked size | 15.9 MB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 594 | | Maintainers | pi0 | ## Links - npm: https://www.npmjs.com/package/clippyjs - Repository: https://github.com/pi0/clippyjs - Homepage: https://github.com/pi0/clippyjs#readme - Issues: https://github.com/pi0/clippyjs/issues - npm.io page: https://npm.io/package/clippyjs ## Recent versions - 0.1.0 (latest) — 2026-02-17 - 0.0.3 — 2017-06-10 - 0.0.2 — 2017-06-10 - 0.0.1 — 2017-06-10 ## README # Clippy Add Clippy or his friends to any website for instant nostalgia! [**Online Demo**](https://clippy.pi0.io/) ## Usage ### CDN (no build tools) You can use ClippyJS directly in the browser with a ` ``` ### npm package Install and import an agent: ```js import { initAgent } from "clippyjs"; import { Clippy } from "clippyjs/agents"; // Load and show the agent const agent = await initAgent(Clippy); agent.show(); ``` ### Available agents You can import agents individually or all at once: ```js // Import all agents import * as agents from "clippyjs/agents"; // Or import individually import { Clippy } from "clippyjs/agents"; // Also available: Bonzi, F1, Genie, Genius, Links, Merlin, Peedy, Rocky, Rover ``` Each agent can also be imported from its own subpath: ```js import Merlin from "clippyjs/agents/merlin"; ``` ## API All agent actions are queued and executed sequentially, so you can chain them. ```js // Play a specific animation agent.play("Searching"); // Play a random animation agent.animate(); // List all available animations agent.animations(); // => ["MoveLeft", "Congratulate", "Hide", "Pleased", "Acknowledge", ...] // Show a speech balloon agent.speak("When all else fails, bind some paper together. My name is Clippy."); // Move to a given point, using animation if available agent.moveTo(100, 100); // Gesture at a given point (if a gesture animation is available) agent.gestureAt(200, 200); // Stop the current action in the queue agent.stopCurrent(); // Stop all actions and return to idle agent.stop(); // Hide the agent agent.hide(); // Pause and resume animations agent.pause(); agent.resume(); // Remove the agent from the DOM agent.dispose(); ``` # License [MIT](./LICENCE) This project is a fresh rewrite of [Clippy.JS](http://smore.com/clippy-js). - [Clippy.JS](http://smore.com/clippy-js) by [Smore](http://smore.com) - [Cinnamon Software](http://www.cinnamonsoftware.com/) for developing [Double Agent](http://doubleagent.sourceforge.net/), the program used to unpack Clippy and his friends - Microsoft, for creating Clippy :) --- _Source: https://npm.io/package/clippyjs · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._