Demo

Check out the live demo: GitHub Pages Demo

Color Border

Welcome to the Color Border project! This project creates a grid of squares that change colors when hovered over, providing a colorful and dynamic user experience. It uses HTML, CSS, and JavaScript to add interactivity and styles.

Project Features

• Interactive Squares: Hover over each square to change its background color and add a glowing effect.
• Dynamic Colors: Colors are randomly chosen from a predefined set each time you hover over a square.
• Smooth Transitions: The squares transition between colors with a smooth effect, providing a visually engaging experience.
• Responsive Layout: The grid is centered on the screen and adjusts based on the window size.

Libraries Used

• HTML: Structure of the page and interactive elements.
• CSS: Styling for the grid, squares, animations, and transitions.
• JavaScript: Logic for adding/removing colors when hovering over squares and generating random colors.

Installation

1. Extract the ZIP file.

2. Navigate to the project folder:

cd color-border

3. Open the index.html file in your browser to see the page in action.

Usage

• Hover over the squares to see them change colors.

• Each square randomly picks a color from the predefined color set when hovered over.

• The glowing border effect will be visible around each square as you hover over them.

Author

Created by MDJAmin. Check out more projects on GitHub.