Skip to content

Latest commit

 

History

History
64 lines (43 loc) · 2.23 KB

README.md

File metadata and controls

64 lines (43 loc) · 2.23 KB

Random Background Color Generator

A fun and interactive project that lets users change the background color of the page using buttons and a color picker. This project is great for learning and practicing JavaScript, HTML, and CSS.

Project Preview

Table of Contents

About the Project

This project allows users to interact with the webpage to dynamically change its background color. It includes a color picker, buttons for random color changes, and a clipboard feature to copy the color code.

Features

  • Random Color Generator: Generates random background colors on button click.
  • Mouseover Interaction: Changes the background color when the mouse hovers over specific buttons.
  • Color Picker Input: Lets users manually pick a color for the background.
  • Copy to Clipboard: Copies the generated color code to the clipboard.

Technologies Used

  • HTML5: For structuring the webpage.
  • CSS3: For styling the project layout and elements.
  • JavaScript (ES6): For dynamic interactions.
  • Font Awesome: For the clipboard icon.

How to Use

  1. Clone the repository:
    git clone https://github.com/codEdu-Collective/js-dom-random-background.git
  2. Navigate to the project folder and open index.html in your browser.
  3. Use the color picker or the buttons to change the background color dynamically.
  4. Click the clipboard icon to copy the color code.

What I Learned

This project helped me:

  • Understand DOM manipulation using JavaScript.
  • Work with event listeners like click and mouseover.
  • Use input elements for color picking and integrate them with JavaScript.
  • Implement a clipboard copy functionality.

Acknowledgments

Thanks to resources like: