Recipe Ingredient Unit Converter

WHAT IT DOES

Recipe Ingredient Unit Converter automatically detects ingredient lists on cooking and food websites and converts measurements between different unit systems. When you visit a recipe page, the extension scans the ingredient list and adds converted measurements directly next to each ingredient. For example, "1 cup flour" becomes "1 cup flour (240 ml, 8 fl oz)" and "350°F" becomes "350°F (177°C)". The extension supports volume conversions (cups to milliliters, tablespoons to teaspoons, fluid ounces to milliliters), weight conversions (ounces to grams, pounds to kilograms), and temperature conversions (Fahrenheit to Celsius and vice versa). You can choose your preferred unit system—metric, imperial, or both—and the extension will display the conversions that match your preference. This makes it easy to follow recipes regardless of the original unit system used.

WHERE IT RUNS

The extension works on every website with recipe content, including food blogs, cooking sites, recipe aggregators, and any page with structured ingredient lists. It runs locally in your browser, scanning ingredient elements and performing conversions without sending any data to external servers. The extension supports all major browsers and adapts to both desktop and mobile viewports seamlessly.

HOW TO USE

After installation, the extension automatically converts ingredients on recipe pages (if auto-convert is enabled). Each converted measurement appears as a small blue annotation next to the original ingredient. A notification briefly shows how many ingredients were converted. To customize the experience, open the extension panel and choose your preferred unit system (Metric, Imperial, or Both). Toggle "Show notification on conversion" to enable or disable the notification. Toggle "Auto-convert on page load" to enable or disable automatic conversion. Click "Convert Ingredients Now" to manually convert all ingredients, or "Remove Conversions" to clear the annotations. For per-site customization, enable or disable the extension on specific websites using the per-site controls.

THE ACTUAL MECHANISM — INGREDIENT PARSING WITH UNIT CONVERSION PIPELINE

The extension uses a multi-stage ingredient detection and conversion pipeline. First, it scans the page for ingredient elements using a comprehensive list of selectors (`.ingredients li`, `.ingredient-list li`, `[itemprop="recipeIngredient"]`, and many more). For each ingredient, it extracts the text content and applies a regex-based parser that matches patterns like "1 cup flour", "2 tablespoons sugar", or "350°F". The parser extracts the numeric value, the unit, and the ingredient name. The unit is normalized using a unit alias map (e.g., "tbsp" → "tablespoon", "c" → "cup"). Based on the user's selected unit system (metric, imperial, or both), the extension applies conversion functions that look up conversion factors from a built-in conversion table. For volume units, conversions go to milliliters, liters, cups, tablespoons, teaspoons, and fluid ounces. For weight units, conversions go to grams, kilograms, ounces, and pounds. Temperature conversions use formulas (°F to °C and vice versa). The converted values are formatted and inserted as inline annotations with a distinct blue color. The extension uses a MutationObserver to detect new ingredients added dynamically and re-converts them automatically.

THE PANEL

The settings panel is a lightweight, draggable overlay that appears in the center of your screen. You can reposition it by clicking and dragging the title bar; release it near the screen edge and it will snap into place automatically. To collapse the panel into a compact title bar, click the minimize button, expanding it again with the same control. The panel is fully responsive, adapting to different screen resolutions with a minimum width of 300px and a maximum of 480px. Press the Escape key at any time to dismiss the panel without applying changes. All controls—the enable/disable toggle, convert/remove buttons, unit system selector, notification toggle, auto-convert toggle, and per-site controls—are accessible within a clean, high-contrast interface that respects your system's color scheme.

PLEASE NOTE

This extension requires the free BotGentz companion extension to be installed and active, which provides the underlying DOM access and storage engine. The ingredient detection relies on common recipe page structures and may not work on all cooking sites—custom selectors may be needed for unique implementations. The conversion factors are approximate (e.g., 1 cup = 240 ml) and may not be exact for all ingredients, as ingredient density varies. The extension is designed for recipe ingredient conversion and may not work for other types of measurement data. No personal data, browsing history, or recipe content is ever collected, stored, or transmitted. All settings are saved using the browser's storage API and remain solely on your device. The extension does not inject ads, trackers, or analytics of any kind.