๐ช magic_cursor
A customizable and interactive magic cursor for Flutter Web and Desktop. Replace the default mouse pointer with a smooth animated cursor featuring glow, gradient effects, and smart interaction highlighting.

โจ Features
- ๐ฅ Custom glow and gradient effects
- ๐ง Smart highlight border around interactive elements
- ๐งฉ Works with custom
MagicButtonandMagicGestureDetector - ๐ฏ Fully customizable cursor widget
- ๐ป Designed for Flutter Web


๐ Getting Started
Add this to your pubspec.yaml:
dependencies:
magic_cursor: ^0.0.1
Then import it:
import 'package:magic_cursor/magic_cursor.dart';
๐งช Example
void main() {
runApp(
const MagicCursor(
config: CursorConfig(
enableGlow: true,
enableGradient: true,
),
showHighlightBorder: true,
cursorChild: Text("โข", style: TextStyle(fontSize: 20)),
child: MyApp(),
),
);
}
Inside your app:
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: MagicButton(
onTap: () => print("Clicked!"),
child: Text("Click Me"),
),
),
),
);
}
}
MagicButton and MagicGestureDetector auto-enable hover interactivity detection.
| Property | Type | Default | Description |
|---|---|---|---|
enableGlow |
bool |
false |
Adds a soft glow to the cursor |
enableGradient |
bool |
false |
Enables gradient color animation |
showHighlightBorder |
bool |
false |
Shows a border around interactive widgets |
cursorChild |
Widget? |
null |
Custom content inside the cursor |
๐งฑ Widgets
๐ MagicButton
Wraps any widget with interaction metadata and gesture support.
MagicButton(
onTap: () {},
child: Text("Hover me"),
)
๐งฒ MagicGestureDetector
Add interaction detection to any widget.
MagicGestureDetector(
onTap: () {},
child: Container(...),
)
๐ License
MIT License
๐ก Contribution
Pull requests and feedback welcome! If you encounter issues or want to request a feature, please open an issue.
Made with โค๏ธ by Sanjay Adhikari