So I have a React app and in it I need to check the balance of USDC tokens in my smart contract. For that there is a simple solution, but somehow the USDC value on display does not format (it has 12 decimals more than supposed to).

import React, {useState, useEffect} from 'react';
import { ethers } from "ethers";

const contractAddress = "0x4193f089C9e41135329c989a0899B60B101C3994"
const USDCAddress = "0x07865c6E87B9F70255377e024ace6630C1Eaa37F"

const ERC20ABI = ["function balanceOf(address _owner) public view returns (uint256 balance)"]

function App() {

const [USDCBalance, setUSDCBalance] = useState('')

async function getUSDCBalance() {

    const USDCTokenContract = await new ethers.Contract(

    let USDC = await USDCTokenContract.balanceOf(contractAddress)
    USDC = ethers.utils.formatEther(USDC, 6)


<p>Contract USDC balance: {USDCBalance}</p>

export default App;

And so, the app displays "Contract USDC balance: 0.000000000001" when in reality there is a whole 1 USDC in the smart contract (on Goerli testnet).

Any ideas wth?

1 Answer 1


Solved. Needed to use formatUnits instead of formatEther

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.