π I built a 400B clipboard library for React (with an agnostic core)
Copying to the clipboard sounds simple⦠until you try to do it properly.
Permissions, async APIs, browser quirks, and UI feedback quickly turn something that should be one line into unnecessary boilerplate.
So I built lite-clipboard.
What is lite-clipboard?
lite-clipboard is a tiny, zero-dependency clipboard library with a framework-agnostic core and a React hook on top.
React usage
import { useClipboard } from 'lite-clipboard';
function CopyButton({ text }) {
const { copied, copy } = useClipboard();
return (
button onClick={() => copy(text)}>
{copied ? 'Copied!' : 'Copy'}
button>
);
}
Simple, reactive, and no boilerplate.
Framework-agnostic core
If you're not using React:
import { copy } from 'lite-clipboard/core';
await copy("Hello world");
No framework required.
Why another clipboard library?
Most existing solutions are:
β Bigger than they need to be (1KBβ2KB+)
β Not React-friendly (no state, no hooks)
β Missing TypeScript support
β Require manual state handling (setTimeout, etc.)
I wanted something:
β Minimal
β Modern
β React-friendly
β And reusable outside React
β‘ Features
π ~400 bytes (React hook), ~250 bytes (core)
π 0 dependencies
βοΈ Built-in React state (copied, error, supported)
π Auto-reset (no manual timers)
π― Callbacks (onSuccess, onError)
π§© Framework-agnostic core
π SSR safe
π§ͺ TypeScript-first
π¦ Size comparison
π‘ Design philosophy
π Links
GitHub: https://github.com/matifandy8/lite-clipboard
npm: https://www.npmjs.com/package/lite-clipboard
Product Hunt (launch): https://www.producthunt.com/posts/li...te?code=QN3IzM
π Support the launch
If you find it useful, I'd really appreciate your support on Product Hunt π
Feedback, comments, or even just an upvote helps a lot!
More...
Copying to the clipboard sounds simple⦠until you try to do it properly.
Permissions, async APIs, browser quirks, and UI feedback quickly turn something that should be one line into unnecessary boilerplate.
So I built lite-clipboard.
What is lite-clipboard?
lite-clipboard is a tiny, zero-dependency clipboard library with a framework-agnostic core and a React hook on top.
- Use the core anywhere (vanilla JS, Vue, Svelte, etc.)
- Use the hook for a clean React experience
React usage
import { useClipboard } from 'lite-clipboard';
function CopyButton({ text }) {
const { copied, copy } = useClipboard();
return (
button onClick={() => copy(text)}>
{copied ? 'Copied!' : 'Copy'}
button>
);
}
Simple, reactive, and no boilerplate.
Framework-agnostic core
If you're not using React:
import { copy } from 'lite-clipboard/core';
await copy("Hello world");
No framework required.
Why another clipboard library?
Most existing solutions are:
β Bigger than they need to be (1KBβ2KB+)
β Not React-friendly (no state, no hooks)
β Missing TypeScript support
β Require manual state handling (setTimeout, etc.)
I wanted something:
β Minimal
β Modern
β React-friendly
β And reusable outside React
β‘ Features
π ~400 bytes (React hook), ~250 bytes (core)
π 0 dependencies
βοΈ Built-in React state (copied, error, supported)
π Auto-reset (no manual timers)
π― Callbacks (onSuccess, onError)
π§© Framework-agnostic core
π SSR safe
π§ͺ TypeScript-first
π¦ Size comparison
| lite-clipboard | ~0.4KB | 0 | β | β |
| clipboard.js | ~2.4KB | 1 | β | β |
| copy-to-clipboard | ~1.1KB | 0 | β | β οΈ |
π‘ Design philosophy
- Core first β logic independent from frameworks
- Thin adapters β React is just a wrapper
- Minimal footprint β every byte matters
- Better DX β less code, fewer bugs
π Links
GitHub: https://github.com/matifandy8/lite-clipboard
npm: https://www.npmjs.com/package/lite-clipboard
Product Hunt (launch): https://www.producthunt.com/posts/li...te?code=QN3IzM
π Support the launch
If you find it useful, I'd really appreciate your support on Product Hunt π
Feedback, comments, or even just an upvote helps a lot!
More...