Please bookmark this page to avoid losing your image tool!

Image Text Overlay Tool For Russian Phrases

(Free & Supports Bulk Upload)

The result will appear here...

JavaScript Code (For Advanced Users)

You can edit the below JavaScript code to customize the image tool.

function processImage(originalImg, phrase = "Не входить", position = "bottom", fontSizePct = 10, textColor = "#FFFFFF") {
    const canvas = document.createElement('canvas');
    canvas.width = originalImg.width;
    canvas.height = originalImg.height;

    const ctx = canvas.getContext('2d');
    
    // Draw the original image onto the canvas
    ctx.drawImage(originalImg, 0, 0);

    // Calculate font size based on percentage of image height, ensuring minimum usability
    const fontSize = Math.max(12, Math.floor(canvas.height * (Number(fontSizePct) / 100)));
    
    // Arial handles Cyrillic characters perfectly without requiring external fonts
    ctx.font = `bold ${fontSize}px Arial, sans-serif`;
    ctx.textAlign = 'center';
    
    let x = canvas.width / 2;
    let y = 0;
    const padding = Math.floor(canvas.height * 0.05);

    // Determine Y coordinate based on position parameter
    const pos = String(position).toLowerCase();
    if (pos === 'top') {
        ctx.textBaseline = 'top';
        y = padding;
    } else if (pos === 'center') {
        ctx.textBaseline = 'middle';
        y = canvas.height / 2;
    } else { // Defaults to bottom
        ctx.textBaseline = 'bottom';
        y = canvas.height - padding;
    }

    // Set styling for text to maximize readability against light or dark backgrounds
    ctx.lineWidth = Math.max(1, fontSize / 12);
    ctx.strokeStyle = '#000000';
    ctx.fillStyle = textColor;
    
    // Add text shadow (drop shadow)
    ctx.shadowColor = 'rgba(0, 0, 0, 0.75)';
    ctx.shadowBlur = Math.max(3, fontSize / 5);
    ctx.shadowOffsetX = Math.max(1, fontSize / 20);
    ctx.shadowOffsetY = Math.max(1, fontSize / 20);

    // Ensure the text does not overflow the image horizontally
    const maxWidth = canvas.width * 0.9;

    // Draw stroke (outline) first, then fill
    ctx.strokeText(phrase, x, y, maxWidth);
    ctx.fillText(phrase, x, y, maxWidth);

    return canvas;
}

Free Image Tool Creator

Can't find the image tool you're looking for?
Create one based on your own needs now!

Create a custom image tool

Description

This tool allows users to overlay Russian text onto images with customizable settings. Users can specify the phrase, choose the text position (top, center, or bottom), adjust the font size relative to the image dimensions, and select a text color. The tool automatically applies a stroke and shadow to ensure the Cyrillic text remains legible against various backgrounds. It is useful for creating warning signs, adding captions to social media posts, or generating instructional imagery in Russian.