LogoCommodityPriceAPI

Build a Chrome Extension Using a Gold Price API Free (2026): Step-by-Step Tutorial

By

Ejaz Ahmed

17 Mar 2026 • 10 min read

Gold Price API Free: Build a Chrome Extension

Ever tried to track the price of gold with 20 browser tabs open? It is a nightmare. Consequently, you continuously check the sites on financial news to know whether the precious metal market has moved. Thus, this manual machine kills productivity and wastes time.

This guide will develop a smooth Chrome Extension. First, it will fetch the gold spot price API at no cost. Then we will retrieve the real-time data using CommodityPriceAPI, a developer-friendly API for live commodity prices.

At the end, you will have a tool that displays gold, silver, and platinum prices at a single click. For example, on February 25, 2026, gold was trading at roughly $5,180 to $5,200 per ounce, depending on the source and timing.

We are going to discuss the gold price API free implementation, manifest files, and JavaScript integration using the CommodityPriceAPI documentation. Moreover, I will demonstrate how to work with the API request and present the prices in a clean pop-up.

Moreover, I will demonstrate how to work with the API request and present the prices in a clean pop-up. It's time to explore the world of precious metals, spot prices, and code!

In the next steps, we will build the Chrome extension step-by-step using a free Gold Price API.

Step 1: Get Your Free Gold Price API Key

First, you must connect with the data source. Many free gold price APIs can be set up very quickly, often in under 30 seconds. Hence, go to CommodityPriceAPI and create an account.

  • Navigate to the Dashboard.
  • Copy your unique API key.
  • Keep it private! Don't sell or share it on GitHub.
  • Record the rate limits for your plan. Free gold price APIs usually come with a limited number of monthly requests at no cost.

Free gold spot price API is one that lets you retrieve gold, silver, and even palladium spot prices. Moreover, you can find your used quota in the usage endpoint. Once you pass the limit of counts, you may have to upgrade your subscription plan.

Create a folder anywhere on your PC.

Example:

Desktop
   gold-price-extension

Inside this folder create 3 files

gold-price-extension
│
├── manifest.json
├── popup.html
└── popup.js

You can create them using:

Right click → New → Text file → rename.

Step 2: Creating the Extension Manifest

All Chrome Extensions require a manifest.json. This file informs Chrome of what your app does. It also specifies the permissions of the site and the background scripts. This is similar to how developers document endpoints and access levels when working with a gold price API free.

{
  "manifest_version": 3,
  "name": "Gold Tracker Pro",
  "version": "1.0",
  "description": "Live gold price tracker using CommodityPriceAPI.",
  "permissions": ["storage"],
  "action": {
    "default_popup": "popup.html"
  },
  "host_permissions": [
    "https://api.commoditypriceapi.com/*"
  ]
}

This file determines the default behavior. Thus, we apply version 3 because it is more reliable. It guarantees compatibility with the most recent versions of Chrome. To make an API request to the gold price API free service, we also request host permissions.

Step 3: Designing the Pop-up Interface

Your users or customers require a clean application interface. Thus, we will prepare a popup.html. It will present the value of gold, silver, and platinum in USD.

<!DOCTYPE html>
<html>
<head>
<style>
body {
  width:250px;
  font-family:Arial;
  padding:10px;
}

.price-box{
  display:flex;
  justify-content:space-between;
  margin:6px 0;
}

.gold{
  color:#D4AF37;
  font-weight:bold;
}
</style>
</head>

<body>

<h3>Precious Metal Prices</h3>
<hr>

<div id="prices">Loading...</div>

<button id="refresh">Refresh Prices</button>

<script src="popup.js"></script>

</body>
</html>

This straightforward API structure of HTML creates a small window. As a result, it will show the gold price and other precious metal prices using a gold price API free. Gold price APIs can provide pricing data with accuracy up to two decimal places. To trigger a new API request, use a simple button.

Step 4: Fetching Real-Time Data With JavaScript

Time to get down to the technical center of the project. In many cases, adding a gold price API only takes a simple script that you can copy and paste into your website or app.

In this case, we are going to write popup.js that will call the latest rates endpoint of the CommodityPriceAPI. So we shall bring gold (XAU) and silver (XAG) using a gold price API free solution.

const API_KEY = "ADD-YOUR-API-KEY-HERE";

const BASE_URL = "https://api.commoditypriceapi.com/v2/rates/latest";

async function fetchPrices() {

    const display = document.getElementById("prices");

    try {

        const response = await fetch(
            `${BASE_URL}?apiKey=${API_KEY}&symbols=XAU,XAG,PL`
        );

        const data = await response.json();

        if (data.success) {

           const goldPrice = data.rates.XAU ? data.rates.XAU.toFixed(2) : "N/A";
            const silverPrice = data.rates.XAG ? data.rates.XAG.toFixed(2) : "N/A";
            const platinumPrice = data.rates.PL ? data.rates.PL.toFixed(2) : "N/A";

            display.innerHTML = `
                <div class="price-box">
                    <span>Gold (XAU)</span>
                    <span class="gold">$${goldPrice}</span>
                </div>

                <div class="price-box">
                    <span>Silver (XAG)</span>
                    <span>$${silverPrice}</span>
                </div>

                <div class="price-box">
                    <span>Platinum (PL)</span>
                    <span>$${platinumPrice}</span>
                </div>

            `;

        } else {

            display.innerText = "API returned an error.";

        }

    } catch (error) {

        display.innerText = "Connection error.";

    }

}

document.getElementById("refresh").addEventListener("click", fetchPrices);

fetchPrices();

Note: Kindly replace the placeholder "ADD-YOUR-API-KEY" with your actual API key.

Load the Extension in Chrome

Now we install it.

Open Chrome.

Go to:

chrome://extensions

Turn ON

Developer Mode

(top right)

Click:

Load unpacked

Select your folder:

gold-price-extension

Chrome will install the extension.

Run the Extension

Now:

  1. Click the Extensions icon in Chrome
  2. Find Gold Tracker Pro
  3. Click it

The pop-up opens.

You will see something like:

Gold Tracker Pro Extension

These numbers will come directly from the API.

Click:

Refresh Prices

It will call the API again.

This is a script that is based on the REST architecture. Moreover, it works with the JSON response of the free API for gold price. These APIs usually return data in JSON format, so it is easy to parse in almost any programming language.

We will extract the gold and silver values by targeting the rates object using the free gold silver price API. We can see that the metadata of the response indicates that the unit is T.oz and the currency is USD.

Gold price APIs can also support multiple currencies, including USD, EUR, and INR. MetalpriceAPI also provides live and historical gold (XAU) spot prices in 150+ currencies, with data updated frequently.

Note: For demonstration purposes, this example stores the API key on the client-side JavaScript. Using a backend service instead of API requests is recommended in production environments to prevent your API key from being publicly disclosed.

Why Use a Gold Price API Free for Your Project?

The gold price varies on a recurring and periodic basis. In addition, international gold, silver, platinum, and palladium markets do not sleep. Developers require an effective source of data to stay in touch. The application of a gold price API free enables you to create a demo or a small application with no initial expenses.

The free plan is ideal in terms of learning. It actually provides access to live feed data via API. Consequently, you are able to keep an eye on the maximum price of the day.

It is also possible to monitor the current gold spot price API free of your personal store or business. Gold price APIs can also be tailored to match specific business needs and use cases. Many companies in the world use these tools.

They apply them when determining product prices for the customers, especially when using a gold price API free solution. Real-time data feeds from gold price APIs can also help e-commerce platforms keep pricing accurate. Gold price APIs can also support dynamic pricing for a large number of products across different platforms.

The majority of precious metals API providers, such as CommodityPriceAPI, provide bank-level protection. Consequently, this guarantees your data security.

You also get detail API documentation, even on a free gold price API. Some gold price APIs also offer plugins for popular content management systems like WordPress and Drupal. This, in turn, facilitates the process of integration easily and within a short period.

Helpful Resource: Why Every Business Needs Live Commodity Data Now

Choosing the Right API: CommodityPriceApi vs. Others

Choosing The Right API: CommodityPriceAPI vs. Others

Accuracy and reliability are desired in a free gold price API realtime. nFusion Solutions also highlights the value of reliable data pulled from multiple trusted exchanges and market data providers.

However, there are more scale-paid plans. Still, the free user plan is excellent when one is a beginner. Some APIs, like Alpha Vantage, also offer free access to real-time and historical financial data across different asset classes.

Feature

Lite (Free/Trial)

Plus (Paid)

Premium (Paid)

API Calls

2000 per month

10,000 per month

50,000 per month

Update Frequency

10 minutes

60 seconds

60 seconds

Symbols/Request

5 Symbols

10 Symbols

20 Symbols

Support

Standard

Dedicated

Dedicated

Historical Data

Since 1990

Since 1990

Since 1990

There are the metals-API, gold price API, and free alternatives. Developers can also find several free real-time gold price APIs, including MetalpriceAPI, Metals-API, GoldAPI.io, and Commodities API. For example, GoldAPI offers a flat pricing model with a free tier and a paid plan at $99 USD/month for unlimited requests.

However, CommodityPriceAPI offers a simple API framework. Metals-API also reports 99.99% uptime over the last 12 months, which makes it a reliable option for developers. This makes it a strong metals-API gold price API free option for developers.

Moreover, you will be able to join without a credit card. MetalpriceAPI also has a forever-free plan with no credit card required, and it provides spot pricing using data from multiple sources. You can also review the available plans and limits on the pricing page. Metals-API uses a subscription model that renews automatically unless the user cancels it.

When an upgrade is done to an annual plan, 2 months are usually free. Thus, you would be able to make a payment through the billing section and automatically renew your account.

Helpful Resource: Gold Prices Data: Top 10 Reliable Sources You Must Try

Advanced Features: Historical Trends and Fluctuations

Advanced Features: Historical Trends and Fluctuations

When you upgrade the free plan, you are able to access the time series and fluctuation endpoints of a gold price API free. Thus, it is excellent when it comes to a business that wants to test market volatility.

  • Historical Rates: Data is available since 1990.
  • Time-Series: Retrieve daily rates between two dates.
  • Fluctuation: This is the change in the price of gold within the time period between the start and end dates.

Many users apply these features in India and other regions of the world when making decisions to buy or sell. Consequently, the commodity price API will give the open, high, low, and close prices of any date. Gold price APIs can also show fluctuation data along with the lowest and highest prices for any given day.

This is similar to how a gold price API free solution provides reliable market insights. As a result, you can use this quality data to develop a professional app.

Helpful Resource: Detecting Commodity Price Fluctuations For Smarter Trading Decisions

Handling API Errors and Limits

You have to manage errors when you are using a live gold price API free. To give an example, the API provides a 429 code when you exceed your rate limits. Similarly, when you use an incorrect API key, you will receive either 404 or 401.

Note: The success in the response is always checked in the JSON response. This is hence a developer practice.

In case your app needs more usage, you can upgrade to additional API usage. Moreover, the premium and the plus plans will have guaranteed availability.

They also offer specific assistance in case of problems. nFusion Solutions also emphasizes timely, professional support with in-house technical help. So, you can also access the gold price API free option and manage all upgrades directly from your account dashboard.

TL;DR

  • What: a Chrome Extension that tracks precious metals.
  • Why: You can get real-time data on gold, silver, and platinum right in your browser.
  • How: CommodityPriceAPI with a free real-time gold price API key.
  • Important Files: popup.html, popup.js, and manifest.json.
  • Free Plan: 2000 calls/month and 10-minute updates.

Conclusion

The project of creating a tracker with a gold price free is rewarding. Furthermore, it addresses the practical issue of fragmented market data.

Now, you are aware of how to retrieve an API key and create a Chrome Extension. Retrieve free gold price API live data. You can also explore a gold price API free option to get started without upfront costs.

Reliable data is important whether you are constructing it yourself or for your customers. These APIs usually pull data from trusted, high-volume sources such as the London Bullion Market Association (LBMA). Thus, CommodityPriceAPI provides an easy means of integrating your application into the global marketplace.

It works in a similar way to a metals-API free plan gold price API that helps developers start quickly. Begin with the free plan and see how it works. Then, expand as you grow.

FAQs

Is There a Free Gold Price API for Developers?

Yes, the Lite plan has a free gold price API and 2000 monthly calls. It is ideal in terms of a demo or even personal usage.

How Often Does a Free Gold Price API Update Prices?

You can monitor gold, silver, platinum, palladium, and 130+ other commodities. This incorporates energy products such as WTI Crude.

How Often Does the Data Update?

On the free plan, prices are updated every 10 minutes. To get real-time updates (60 seconds), you need to upgrade to a Plus or Premium plan when using a gold price API free option.

Can I Use This for a Commercial Business?

Absolutely. A large number of companies apply the precious metals API to their store or app. All you have to do is ensure that your plan will cover your expected API request volume.

What if I Need Historical Data?

History is normally provided in gold price API, free metals-API style services. All plans offer historical data that goes back to 1990 with CommodityPriceAPI, making it a reliable gold price API free solution for developers and financial platforms.

How Do I Get a Free Gold Price API Key?

You can get a free Gold Price API key by signing up on CommodityPriceAPI. After creating an account, generate your API key from the dashboard and use it in your API requests to retrieve live gold, silver, and other commodity prices.

CommodityPriceAPI
Simple, Fast and Reliable

Get real-time commodity prices data for oil, gold, silver, corn, wheat, natural gas and more.

🚀 Get started
Gold Price API: Build a Free Chrome Extension (2026 Guide)