sort by alpha icon

sort-by-alpha-rounded from Material Symbols by Google · Rounded · UI Actions · Apache-2.0 Free for personal and commercial use.

Name: sort-by-alpha-rounded
Set: Material Symbols
Style: Rounded
Category: UI Actions
Viewbox: 24×24
License: Apache 2.0
Aliases: sort-by-alpha-outline-rounded

1 other variant in Material Symbols

sort-by-alpha

The same icon in other sets

sort-by-alphaMaterial Symbols Light

More ui actions icons from Material Symbols

Use the sort by alpha icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m4.9 14.6l-.575 1.75q-.1.275-.35.463t-.55.187q-.5 0-.812-.413t-.113-.912l3-8.025q.125-.3.375-.475T6.45 7h.75q.325 0 .575.175t.375.475l3.025 8.075q.175.475-.112.875t-.788.4q-.3 0-.55-.187t-.35-.463L8.75 14.6zm.6-1.7h2.6L6.9 9.15h-.15zm10.45 2.3h4.15q.375 0 .638.263T21 16.1t-.262.638T20.1 17h-5.8q-.25 0-.425-.175T13.7 16.4v-.95q0-.175.05-.337t.175-.288L18.75 8.8H14.8q-.375 0-.638-.262T13.9 7.9t.263-.638T14.8 7h5.55q.25 0 .425.175t.175.425v.95q0 .175-.05.337t-.175.288zM9.6 5q-.175 0-.237-.15t.062-.275L11.65 2.35q.15-.15.35-.15t.35.15l2.225 2.225q.125.125.063.275T14.4 5zm2.05 16.65l-2.225-2.225q-.125-.125-.062-.275T9.6 19h4.8q.175 0 .238.15t-.063.275L12.35 21.65q-.15.15-.35.15t-.35-.15"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsSortByAlphaRounded(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m4.9 14.6l-.575 1.75q-.1.275-.35.463t-.55.187q-.5 0-.812-.413t-.113-.912l3-8.025q.125-.3.375-.475T6.45 7h.75q.325 0 .575.175t.375.475l3.025 8.075q.175.475-.112.875t-.788.4q-.3 0-.55-.187t-.35-.463L8.75 14.6zm.6-1.7h2.6L6.9 9.15h-.15zm10.45 2.3h4.15q.375 0 .638.263T21 16.1t-.262.638T20.1 17h-5.8q-.25 0-.425-.175T13.7 16.4v-.95q0-.175.05-.337t.175-.288L18.75 8.8H14.8q-.375 0-.638-.262T13.9 7.9t.263-.638T14.8 7h5.55q.25 0 .425.175t.175.425v.95q0 .175-.05.337t-.175.288zM9.6 5q-.175 0-.237-.15t.062-.275L11.65 2.35q.15-.15.35-.15t.35.15l2.225 2.225q.125.125.063.275T14.4 5zm2.05 16.65l-2.225-2.225q-.125-.125-.062-.275T9.6 19h4.8q.175 0 .238.15t-.063.275L12.35 21.65q-.15.15-.35.15t-.35-.15"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="m4.9 14.6l-.575 1.75q-.1.275-.35.463t-.55.187q-.5 0-.812-.413t-.113-.912l3-8.025q.125-.3.375-.475T6.45 7h.75q.325 0 .575.175t.375.475l3.025 8.075q.175.475-.112.875t-.788.4q-.3 0-.55-.187t-.35-.463L8.75 14.6zm.6-1.7h2.6L6.9 9.15h-.15zm10.45 2.3h4.15q.375 0 .638.263T21 16.1t-.262.638T20.1 17h-5.8q-.25 0-.425-.175T13.7 16.4v-.95q0-.175.05-.337t.175-.288L18.75 8.8H14.8q-.375 0-.638-.262T13.9 7.9t.263-.638T14.8 7h5.55q.25 0 .425.175t.175.425v.95q0 .175-.05.337t-.175.288zM9.6 5q-.175 0-.237-.15t.062-.275L11.65 2.35q.15-.15.35-.15t.35.15l2.225 2.225q.125.125.063.275T14.4 5zm2.05 16.65l-2.225-2.225q-.125-.125-.062-.275T9.6 19h4.8q.175 0 .238.15t-.063.275L12.35 21.65q-.15.15-.35.15t-.35-.15"/></svg>
</template>

CSS

.icon-sort-by-alpha-rounded {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m4.9%2014.6l-.575%201.75q-.1.275-.35.463t-.55.187q-.5%200-.812-.413t-.113-.912l3-8.025q.125-.3.375-.475T6.45%207h.75q.325%200%20.575.175t.375.475l3.025%208.075q.175.475-.112.875t-.788.4q-.3%200-.55-.187t-.35-.463L8.75%2014.6zm.6-1.7h2.6L6.9%209.15h-.15zm10.45%202.3h4.15q.375%200%20.638.263T21%2016.1t-.262.638T20.1%2017h-5.8q-.25%200-.425-.175T13.7%2016.4v-.95q0-.175.05-.337t.175-.288L18.75%208.8H14.8q-.375%200-.638-.262T13.9%207.9t.263-.638T14.8%207h5.55q.25%200%20.425.175t.175.425v.95q0%20.175-.05.337t-.175.288zM9.6%205q-.175%200-.237-.15t.062-.275L11.65%202.35q.15-.15.35-.15t.35.15l2.225%202.225q.125.125.063.275T14.4%205zm2.05%2016.65l-2.225-2.225q-.125-.125-.062-.275T9.6%2019h4.8q.175%200%20.238.15t-.063.275L12.35%2021.65q-.15.15-.35.15t-.35-.15%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22m4.9%2014.6l-.575%201.75q-.1.275-.35.463t-.55.187q-.5%200-.812-.413t-.113-.912l3-8.025q.125-.3.375-.475T6.45%207h.75q.325%200%20.575.175t.375.475l3.025%208.075q.175.475-.112.875t-.788.4q-.3%200-.55-.187t-.35-.463L8.75%2014.6zm.6-1.7h2.6L6.9%209.15h-.15zm10.45%202.3h4.15q.375%200%20.638.263T21%2016.1t-.262.638T20.1%2017h-5.8q-.25%200-.425-.175T13.7%2016.4v-.95q0-.175.05-.337t.175-.288L18.75%208.8H14.8q-.375%200-.638-.262T13.9%207.9t.263-.638T14.8%207h5.55q.25%200%20.425.175t.175.425v.95q0%20.175-.05.337t-.175.288zM9.6%205q-.175%200-.237-.15t.062-.275L11.65%202.35q.15-.15.35-.15t.35.15l2.225%202.225q.125.125.063.275T14.4%205zm2.05%2016.65l-2.225-2.225q-.125-.125-.062-.275T9.6%2019h4.8q.175%200%20.238.15t-.063.275L12.35%2021.65q-.15.15-.35.15t-.35-.15%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols/sort-by-alpha-rounded.svg?color=%231a73e8&size=48