PORTFOLIO

Featured Image Maker

Featured Image Maker
(01)

Project Description

Featured Image Maker is a tool that allows users to generate customized featured images by overlaying text on any uploaded image. It provides several customization options to create visually appealing graphics ideal for social media, blog headers, or marketing content.

This tool was developed for Al-Araby Al-Jadeed, streamlining the process of producing consistent and professional featured images for their content and social media posts.

Live Preview: harbyj.github.io/featured-image

(02)

Features

  • Image Upload: Upload any image file to use as the background.
  • Headline: Input the overlay text to appear on the image.
  • Font Size: Adjust the size of the text using a slider.
  • Text Color: Choose a text color with the color picker.
  • Font Style: Select between normal and italic styles.
  • Shadow Intensity: Control how strong the text shadow appears.
(03)

Usage Instructions

  1. Upload an Image: Click the upload button and select your preferred image file.
  2. Enter Headline: Type the text you want to overlay on the image.
  3. Customize Text:
    • Font Size: Use the slider to set the text size.
    • Text Color: Pick a color using the color picker.
    • Font Style: Choose between normal or italic fonts.
    • Shadow Intensity: Adjust how dark or soft the text shadow appears.
  4. Download Image: Save the final generated image to your device.

The image is updated in real-time as you make changes.

(04)

Installation

  1. Clone the repository: git clone https://github.com/harbyj/featured-image.git
  2. Navigate to the project folder: cd featured-image
  3. Open index.html in your browser to run the tool locally.