Icon

Interface icons — one set, one technique. Line art on a 24×24 grid, inked by the parent's text colour, scaled by a single number.

When to use it

The interface needs a symbol — inside a button, in navigation, next to an empty state, beside a label in a list.
You are about to draw an <svg> straight into a component. That is the moment to come here: five unrelated sets in one repo grew exactly like that, one icon at a time.
The glyph you need is missing. Add it to the set — one more icon is cheaper than a sixth island.

It is a manufacturing operation icon. That set has its own rules — IngotOpIcon. The key is stored by the backend and the icon alone is a riddle.
The icon would have to carry meaning that is written nowhere else. A symbol on its own cannot be guessed reliably; write the label and keep the icon beside it as decoration.
You need a picture, not a symbol — a logo, an illustration, a photo. This set is single-colour line art, not an image library.

name: IngotIconName — A key from the set. An unknown key fails typecheck; if one arrives from data the component renders nothing and says so in the console in dev.
size: number — Square edge in px, default 14. Scale: 13 in a small button, 14 in a button, 15 in navigation, 20 next to an empty state.
title: string — Fill in ONLY when the icon stands alone and carries meaning. Leave it empty next to text — otherwise a screen reader says the same thing twice.
className: string — Extra classes. Do not set the colour here — the icon inherits the parent's currentColor.
testId: string — data-testid of the element.