Canvas Circles with Arrows is a fun interactive web project built using HTML5 Canvas and JavaScript. It allows you to create circles with different colors on the left side of the canvas, and arrows on the right side. When you click inside a circle, the corresponding arrow starts moving towards the circle and bounces off when it hits the circle. The goal is to hit all the circles with the arrows.
You can see a live demo of the project here.
- Interactive Canvas: Create colorful circles and arrows with interactive click events.
- Animation: Arrows smoothly move towards the circles and bounce off when they collide.
- Responsive Design: The canvas adapts to different screen sizes and orientations.
- Clone the repository:
git clone https://github.com/your-username/canvas-circles-with-arrows.git
- Open
index.html
in your web browser. - Click inside a circle to start the arrow's movement towards it.
- Try to hit all the circles with the arrows.
- HTML5 Canvas: For drawing the circles and arrows.
- JavaScript: For interactivity and animation.
Contributions are welcome! If you have any ideas, improvements, or bug fixes, feel free to open an issue or submit a pull request.
This project is licensed under the MIT License.