/PicFinder

PicFinder is a functional image gallery that enables users to search, view, and download high-quality, royalty-free images from both Pexels and Splash APIs

Primary LanguageCSS

PicFinder - An Image Search Engine

Weather App Demo


Weather App Demo

PicFinder is a web application that allows users to search and download images from Pexels and Splash using their respective APIs. It provides a seamless experience for exploring and accessing a vast collection of high-quality images from these popular stock image providers.

It is a functional image gallery project built using HTML, CSS, and JavaScript and serves as a clone of Pexels, providing a user-friendly interface for browsing and accessing a vast collection of high-quality images.

Features

  • Search Images: Users can search for images by entering keywords or phrases related to the desired subject or theme.

  • Browse Pexels and Splash: The application integrates with the Pexels and Splash APIs, allowing users to access and view images from both platforms through a unified interface.

  • Image Preview: Users can preview the images before downloading, ensuring they select the desired image.

  • Download Images: With a single click, users can download their chosen images in their preferred format and resolution.

  • Responsive Design: The gallery is fully responsive and works seamlessly on different devices and screen sizes.

Technologies Used

PicFinder is built using the following technologies:

  • HTML: Markup language used for creating the structure and layout of the web pages.

  • CSS: Stylesheet language used for styling and visually enhancing the application's user interface.

  • JavaScript: Programming language used for implementing the application's logic, handling user interactions, and making API requests to fetch image data from Pexels and Splash APIs.

APIs Used

PicFinder utilizes the following APIs to fetch and display images:

  • Pexels API
  • Splash API

Please note that you may need to obtain API keys or follow the respective documentation to use these APIs in your application.

How to Use

To use PicFinder, follow these steps:

  1. Clone the repository to your local machine.

    git clone https://github.com/Shaw145/PicFinder.git
  2. Open the index.html file in your web browser.

  3. Use the search bar to enter keywords and find images of interest.

  4. Browse through the images displayed in the gallery.

  5. Click on an image to view it in full size.

  6. Optionally, click the download button to download the image.

Usage

  1. Once the application is running, you will see a search input field and options to choose between Pexels and Splash sites.

  2. Enter your desired search term or keywords related to the images you want to find.

  3. Select the image provider (Pexels or Splash) from the provided options.

  4. Click the "Search" icon to initiate the image search.

  5. Browse through the search results and preview the images.

  6. Click the "Download" icon next to the desired image to download it to your local machine.

Author

  • Suman Shaw

Resource