Featured Image Maker

Created By: Harby Jay
Date: 01/10/2022
Client: Ammar Metawa
Categories: Web Tool Development

Project Description

Featured Image Maker is a tool that allows users to generate customized featured images by overlaying text on an image. It provides several customization options to create visually appealing images that can be used for various purposes, such as social media posts, blog headers, or marketing materials.

This tool was developed as a project for Al-Araby Al-Jadeed, providing a streamlined way to create featured images for their content and social media posts.

Features

Image Upload: Upload any image file to be used as the background.
Headline: Input text that will be overlaid on the image.
Font Size: Adjust the size of the headline text.
Text Color: Choose the color of the text.
Font Style: Select between normal or italic font styles.
Shadow Intensity: Control the intensity of the image shadow.

Live Demo

You can try the tool live here: Featured Image Maker

Installation Instructions

To run this project locally:

1. Clone the repository:

git clone https://github.com/harbyj/featured-image.git

2. Navigate to the project directory:

cd featured-image

3. Open the index.html file in your browser to use the tool locally.

Usage Instructions

Upload an Image: Click the upload button and select the image file you want to use.
Enter Headline: Input the text that will appear on the image.
Customize Text:
- Font Size: Use the slider to set the font size.
- Text Color: Pick a color from the color picker to set the text color.
- Font Style: Choose between normal or italics for the font style.
- Shadow Intensity: Adjust the slider to set how strong the shadow should appear.
Download Image: Save the generated image to your device.

The image will be generated automatically and all changes are visible in real-time.

Screenshots

Here is an example of a generated image: