DocsTheming
Theming
The components use shadcn's theme variables and nothing else, so your theme is their theme. Pick one below to see the same live component change.
Preview
You put in
USDC
How you want to earn
Rates are variable and measured, never promised. Withdraw from available liquidity. mcUSDC is your share of Mercato USDC, a vault on Morpho. You can lose money.
/* Mercato's own theme — the defaults on mercato.sh */
Variables
--backgroundInput wells--card / --card-foregroundEvery card and its text--primary / --primary-foregroundButtons, the selected route, the rate dot--secondary / --secondary-foregroundToken switch, chips, hover--muted-foregroundCaptions, notes, the disclosure--borderCard and input borders--destructiveError messagesFigures
Every number carries a mercato-figure class. Give it your number font:
.mercato-figure {
font-family: var(--font-mono);
font-variant-numeric: tabular-nums;
}What must stay
Restyle anything. Keep what keeps your users informed: the disclosure line under each component; rates labelled variable and measured; mcUSDC described as a share in a lending vault — never a stablecoin, a dollar or a bank account; and withdrawals “from available liquidity”.