Sort icon

interfacearrowsalso known as order, arrange, sort by, ascending
Colors byColorchord

Tap an icon to copy its SVG · copies stay currentColor at 24px — the swatches only tint the preview.

When to use it

Two opposed arrows say 'reorder these rows', usually in a table header or a 'sort by' menu. Feather never drew a dedicated sort glyph, so it's absent here; Tabler's arrows-sort and Iconoir's sort are the most literal. If you need to show the current direction, pair the icon with an explicit ascending/descending caret rather than trusting the base glyph to carry it.

Reach for sort when the action changes the order of a list or table without adding or removing anything — alphabetical, by date, by size. The opposed up-and-down arrows read as 'this column can be reordered'; it belongs in a column header or beside a 'sort by' label. Keep it distinct from filtering, which changes which rows show, and from sliders, which tune values.

  • Reaching for Filter? Reach for the funnel when the control hides non-matching rows rather than reordering all of them.
  • Reaching for List? Reach for the plain list glyph to represent the list itself, not the action of ordering it.
Every set here is open-licensed for commercial use with no attribution required in your product — the notices their licenses do require live on our set pages. No accounts, no download walls.

Related icons