Keyline icons in the fill style. Duotone is reserved for badges.
Rules
1Use only the Keyline fill style (@keyline-icons/react/fill, ~icons/keyline-icons/<name>-fill in Vue). Don't use stroke, two-tone or sharp.
2The one exception: icons inside badges may use duotone (@keyline-icons/react/duotone) so they pick up the badge color.
3Icons in buttons are 16px, in badges 14px, in navigation and feature tiles 20px.
4Put the icon on the left when it names the action (+ New report). Put it on the right when it shows where you go or what opens (Continue →, Options ⌄).
5Mark button icons with data-icon="inline-start" or "inline-end" so the button balances its padding.
6One icon per button. Icon-only buttons need an aria-label and, ideally, a tooltip.