/Image_Library

The Image Library is a sleek and user-friendly web app that allows you to search and explore images from Pixabay's vast collection. Featuring a clean gallery display, intuitive search functionality, and a modal view for easy downloading instructions, it enhances the image browsing experience with smooth transitions and a stylish design.

Primary LanguageJavaScriptMIT LicenseMIT

Image Library

Image Library is a web-based application that allows users to search and browse through images using the Pixabay API. With a sleek and modern design, it provides an easy way to explore and download high-quality images.

Features

  • Search Functionality: Search for images by entering keywords in the search bar.
  • Responsive Gallery: Displays images in a grid layout that adapts to different screen sizes.
  • Image Preview Modal: Click on any image to view it in a modal with download instructions.
  • Load More Images: Dynamically load more images as you explore.
  • Watermark: Displays a customizable watermark at the bottom of the page.
  • Stylish Design: Features a beautiful gradient background, smooth transitions, and hover effects.

Technologies Used

  • HTML5: For the structure of the page.
  • CSS3: For the styling, including animations, transitions, and a responsive layout.
  • JavaScript: For fetching data from the Pixabay API and handling user interactions.
  • Pixabay API: To fetch a wide range of images based on the user's search query.

Installation & Setup

  1. Clone the repository:

    git clone https://github.com/your-username/Image_Library.git

  2. Open the index.html file in your browser to launch the app.

How to Use

  1. Enter a keyword in the search bar and click on the Search button.
  2. Browse through the results in the gallery.
  3. Click on any image to view it in the modal window.
  4. Use the Load More button to see additional images for the same search query.
  5. To close the modal, click the Close button.

License

This project is licensed under the MIT License. See the LICENSE file for more details.

This README.md file provides a clear introduction to the project, instructions for setup and use, and some technical details, making it easy for others to understand and use the Image Library.