wink-cursor 😉

A lightweight React component that replaces the default cursor with a custom image that "winks" on click.

Installation

npm install wink-cursor

Usage

import { WinkCursor } from 'wink-cursor';

function App() {
  return (
    <div className="App">
      <WinkCursor />
      <h1>Click anywhere to see the wink!</h1>
    </div>
  );
}

Props

| Prop       | Type   | Default  | Description                                |
|------------|--------|----------|--------------------------------------------|
| defaultImg | string | https://i.postimg.cc/QdwvSCvX/smile.png | Path or URL to the idle cursor image.      |
| clickImg   | string | https://i.postimg.cc/W3nWR1YV/wink.png | Path or URL to the image shown on click.   |
| size       | number | 32       | The width/height of the cursor in pixels.  |
| duration   | number | 100      | How long (ms) the wink image stays active. |

Demo

wink-cursor-demo

License

MIT License

Copyright (c) 2025 Your Name

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.