web3icons

Ticker or name? Labeling token icons

When to label a token icon with its ticker or its full name, why tickers are ambiguous, how networks differ from tokens, and how to fit labels in grids.

5 min read

Every token icon needs a label, and there are two candidates: ETH or Ethereum, SOL or Solana, USDC or USD Coin. The ticker is short and it's what traders say. The name is what a newcomer recognizes. Most interfaces need both, in different places, and networks complicate things further, because "Ethereum" is also the name of a chain.

This guide sorts out which label goes where, why a ticker on its own is never proof of anything, how to keep tokens and networks apart, and how to fit labels into tight grids without changing their meaning.

What each label is good at

Tickers are compact, usually three to five characters, and they're the standard unit in amounts, pairs and charts. Nobody writes "0.25 Ethereum". Their weakness is meaning: a newcomer has no idea what LDO or ARB stands for, and tickers aren't unique.

Names are recognizable to people who don't trade, and they tell apart some tokens whose tickers look alike. Their weaknesses are length and, less obviously, trust. A token's name is set by whoever deploys the contract, exactly like its ticker. A fake token can call itself "USD Coin" as easily as "USDC".

So the choice isn't between a precise label and a friendly one. Both are claims made by the token's creator. They differ in how much space they take and who they help.

Which label goes where

  • Amounts always use the ticker after the number: 1.25 ETH, 500 USDC. This is the one place with no debate.
  • Token selectors and balance lists use the ticker as the primary label and the name as a secondary line in a quieter style. Search should match both. Designing a token selector covers the rest of that row.
  • Asset pages use the name as the heading with the ticker next to it, because someone arriving from a search may know only one of them.
  • Pairs and charts use tickers: ETH / USDC, SOL on the axis legend.
  • Icon grids depend on cell size. In cells of 64 px or less, the ticker is what fits. Larger cells can show the name with the ticker underneath.
  • Confirmations show the ticker, the chain, and for anything outside a well-known list, the contract address. This is the moment the label has to be precise rather than friendly.
  • Sentences, such as notifications and help text, use the name on first mention ("Ethereum (ETH)") and the ticker after that.

Tickers are ambiguous

Anyone can deploy a token with any ticker, so a selector that shows only tickers invites mistakes. Imitation tokens copy a popular ticker and logo exactly, and nothing in the label tells them apart. A ticker should always travel with something that does distinguish tokens: the name, the logo, a verified indicator from your token list, and the contract address for anything unverified. Fake tokens and spoofed logos goes into the safety side of this.

Tickers also come in families where a prefix or suffix is the whole difference:

  • ETH and WETH, the native coin and its wrapped ERC-20 version.
  • USDC and USDC.e, native USDC and a bridged version on some chains.
  • stETH and wstETH, a rebasing token and its wrapped, non-rebasing version.

These are different tokens with different behavior. A label that drops, truncates or normalizes the prefix or suffix is a wrong label.

A network is not a token

"Ethereum" is a network; ETH is its native token. The same split runs through every major chain: Solana the network and SOL the token, Polygon and POL, BNB Smart Chain and BNB. It's easy to blur the two in an interface, and a user who picks the wrong one ends up on the wrong screen or the wrong chain.

ETH makes it worse, because it's also the gas token on Arbitrum One, Base, Optimism and other networks built on Ethereum. A balance of "ETH" says nothing about which chain it's on. Compare ETH the token with Ethereum the network: related artwork, different things.

A few rules keep them apart:

  • Network switchers and pickers use network names, never tickers. The option is "Base", not "ETH".
  • Token rows use tickers, with the network shown as a badge or a secondary label when the app supports more than one chain.
  • When both matter in one phrase, write "USDC on Base".
  • Use the network's full name when there's any chance of ambiguity. Arbitrum One is commonly shortened to "Arbitrum", which works until you also support Arbitrum Nova.

Fitting labels into grids

Tickers are short but not uniform. Most are three to five characters, some are two, and a few run past ten. Names range from three characters to well over thirty. A grid has to handle both ends.

Never truncate a ticker. "USDC.e" cut to "USDC…" is a different token, and "stE…" is nothing. Size the label area so common tickers fit; in a typical sans serif at 13 px, five uppercase letters need roughly 40 px, depending on the font. For the rare long one, let it wrap or step the font size down a notch rather than cutting it.

Truncate names at the end, or clamp them to two lines. The beginning of a name carries the most information, so cut from the end:

.token-ticker {
  white-space: nowrap;
}

.token-name {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

The prefixed -webkit-line-clamp with display: -webkit-box is the form that works across current major browsers. For a single line, use overflow: hidden, text-overflow: ellipsis and white-space: nowrap, and remember min-width: 0 if the label sits in a flex or grid item; otherwise it won't shrink and the ellipsis never appears.

CSS truncation only changes what's painted. The full text stays in the page, so screen readers still read the whole name. Sighted users need a way to see it too, such as a detail panel or a tooltip that also opens on keyboard focus.

Case and how labels are read

Keep each ticker's official capitalization. stETH, cbBTC and wstETH use lowercase letters on purpose, and text-transform: uppercase on a ticker label turns stETH into STETH. Uppercase slugs in URLs are fine; displayed tickers should match how the project writes them.

Screen readers handle tickers inconsistently. "ETH" may be spoken as a word or spelled out, depending on the screen reader and its settings, and you can't control that reliably. Resist overriding visible tickers with an aria-label containing the full name. WCAG 2.5.3 Label in Name (Level A) asks that a control's accessible name contain its visible label text, so a button that shows "ETH" but is named "Ethereum" fails for people using voice control, who say what they see. Put the name in the visible secondary line instead, where everyone gets it. Making token amounts and prices accessible covers amounts and units in more detail.

The short version:

  • Ticker after amounts, in pairs, in charts and in small grid cells.
  • Name as page headings and first mentions; ticker plus name in selectors and balance lists.
  • Network names for networks, tickers for tokens, and "USDC on Base" when both matter.
  • Never truncate or recase a ticker; truncate names from the end.
  • Never treat either label as proof of which token it is.

For how the same tickers and names become file names, URLs and keys, see naming conventions for large icon libraries.

More in Icon design

All guides