ink stroke arrow up down icon
ink-stroke-arrow-up-down-24-regular from Fluent UI System Icons by Microsoft Corporation · 24 Regular · MIT Free for personal and commercial use.
- Name
- ink-stroke-arrow-up-down-24-regular
- Set
- Fluent UI System Icons
- Style
- 24 Regular
- Viewbox
- 24×24
- License
- MIT
3 other variants in Fluent UI System Icons
Related icons in Fluent UI System Icons
Use the ink stroke arrow up down icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.253 2.93a.75.75 0 0 1 .817-.677l3.745.35c2.652.263 5.193.58 7.278.94c2.047.352 3.764.761 4.688 1.249a2.3 2.3 0 0 1 .662.492c.192.22.362.552.29.957c-.066.372-.307.632-.52.8a3.5 3.5 0 0 1-.818.452c-1.234.511-3.595 1.005-7.328 1.493c-2.38.312-3.895.615-4.758.89l.077.023c.41.121.934.24 1.548.353c1.226.225 2.768.418 4.404.564c1.24.111 2.567.287 3.697.51q.28.056.548.116l-1.274 1.274a37 37 0 0 0-3.105-.406c-1.662-.149-3.254-.346-4.541-.583a17 17 0 0 1-1.703-.39c-.461-.137-.9-.304-1.212-.525a1.3 1.3 0 0 1-.46-.542a1 1 0 0 1 .06-.901c.134-.232.338-.39.516-.5c.187-.116.411-.218.66-.31c.977-.363 2.705-.714 5.348-1.06c3.749-.49 5.922-.966 6.95-1.392l.125-.055c-.732-.34-2.16-.696-4.108-1.032c-2.037-.35-4.537-.663-7.17-.924l-3.739-.35a.75.75 0 0 1-.677-.816m12.333 10.776a1.75 1.75 0 0 0 .19 1.488a60 60 0 0 1-1.928.26c-2.618.312-4.217.71-5.11 1.116c-.448.203-.65.378-.73.483c-.05.064-.043.083-.039.097l.002.004c.015.06.081.194.287.391c.199.19.48.394.832.602c.702.415 1.601.797 2.466 1.093l3.246 1.046a.75.75 0 0 1-.46 1.428l-3.266-1.053c-.923-.316-1.928-.737-2.749-1.222a6 6 0 0 1-1.106-.81c-.303-.29-.587-.656-.702-1.097c-.126-.485-.022-.971.297-1.39c.293-.384.748-.687 1.302-.938c1.111-.505 2.9-.923 5.552-1.24q1.079-.13 1.916-.258m4.694-2.486a.75.75 0 0 0-1.06 0l-2.5 2.5a.75.75 0 1 0 1.06 1.06L19 13.56v6.88l-1.22-1.22a.75.75 0 1 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l2.5-2.5a.75.75 0 1 0-1.06-1.06l-1.22 1.22v-6.88l1.22 1.22a.75.75 0 1 0 1.06-1.06z"/></svg>
React
import type { SVGProps } from "react";
export function FluentInkStrokeArrowUpDown24Regular(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="M3.253 2.93a.75.75 0 0 1 .817-.677l3.745.35c2.652.263 5.193.58 7.278.94c2.047.352 3.764.761 4.688 1.249a2.3 2.3 0 0 1 .662.492c.192.22.362.552.29.957c-.066.372-.307.632-.52.8a3.5 3.5 0 0 1-.818.452c-1.234.511-3.595 1.005-7.328 1.493c-2.38.312-3.895.615-4.758.89l.077.023c.41.121.934.24 1.548.353c1.226.225 2.768.418 4.404.564c1.24.111 2.567.287 3.697.51q.28.056.548.116l-1.274 1.274a37 37 0 0 0-3.105-.406c-1.662-.149-3.254-.346-4.541-.583a17 17 0 0 1-1.703-.39c-.461-.137-.9-.304-1.212-.525a1.3 1.3 0 0 1-.46-.542a1 1 0 0 1 .06-.901c.134-.232.338-.39.516-.5c.187-.116.411-.218.66-.31c.977-.363 2.705-.714 5.348-1.06c3.749-.49 5.922-.966 6.95-1.392l.125-.055c-.732-.34-2.16-.696-4.108-1.032c-2.037-.35-4.537-.663-7.17-.924l-3.739-.35a.75.75 0 0 1-.677-.816m12.333 10.776a1.75 1.75 0 0 0 .19 1.488a60 60 0 0 1-1.928.26c-2.618.312-4.217.71-5.11 1.116c-.448.203-.65.378-.73.483c-.05.064-.043.083-.039.097l.002.004c.015.06.081.194.287.391c.199.19.48.394.832.602c.702.415 1.601.797 2.466 1.093l3.246 1.046a.75.75 0 0 1-.46 1.428l-3.266-1.053c-.923-.316-1.928-.737-2.749-1.222a6 6 0 0 1-1.106-.81c-.303-.29-.587-.656-.702-1.097c-.126-.485-.022-.971.297-1.39c.293-.384.748-.687 1.302-.938c1.111-.505 2.9-.923 5.552-1.24q1.079-.13 1.916-.258m4.694-2.486a.75.75 0 0 0-1.06 0l-2.5 2.5a.75.75 0 1 0 1.06 1.06L19 13.56v6.88l-1.22-1.22a.75.75 0 1 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l2.5-2.5a.75.75 0 1 0-1.06-1.06l-1.22 1.22v-6.88l1.22 1.22a.75.75 0 1 0 1.06-1.06z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M3.253 2.93a.75.75 0 0 1 .817-.677l3.745.35c2.652.263 5.193.58 7.278.94c2.047.352 3.764.761 4.688 1.249a2.3 2.3 0 0 1 .662.492c.192.22.362.552.29.957c-.066.372-.307.632-.52.8a3.5 3.5 0 0 1-.818.452c-1.234.511-3.595 1.005-7.328 1.493c-2.38.312-3.895.615-4.758.89l.077.023c.41.121.934.24 1.548.353c1.226.225 2.768.418 4.404.564c1.24.111 2.567.287 3.697.51q.28.056.548.116l-1.274 1.274a37 37 0 0 0-3.105-.406c-1.662-.149-3.254-.346-4.541-.583a17 17 0 0 1-1.703-.39c-.461-.137-.9-.304-1.212-.525a1.3 1.3 0 0 1-.46-.542a1 1 0 0 1 .06-.901c.134-.232.338-.39.516-.5c.187-.116.411-.218.66-.31c.977-.363 2.705-.714 5.348-1.06c3.749-.49 5.922-.966 6.95-1.392l.125-.055c-.732-.34-2.16-.696-4.108-1.032c-2.037-.35-4.537-.663-7.17-.924l-3.739-.35a.75.75 0 0 1-.677-.816m12.333 10.776a1.75 1.75 0 0 0 .19 1.488a60 60 0 0 1-1.928.26c-2.618.312-4.217.71-5.11 1.116c-.448.203-.65.378-.73.483c-.05.064-.043.083-.039.097l.002.004c.015.06.081.194.287.391c.199.19.48.394.832.602c.702.415 1.601.797 2.466 1.093l3.246 1.046a.75.75 0 0 1-.46 1.428l-3.266-1.053c-.923-.316-1.928-.737-2.749-1.222a6 6 0 0 1-1.106-.81c-.303-.29-.587-.656-.702-1.097c-.126-.485-.022-.971.297-1.39c.293-.384.748-.687 1.302-.938c1.111-.505 2.9-.923 5.552-1.24q1.079-.13 1.916-.258m4.694-2.486a.75.75 0 0 0-1.06 0l-2.5 2.5a.75.75 0 1 0 1.06 1.06L19 13.56v6.88l-1.22-1.22a.75.75 0 1 0-1.06 1.06l2.5 2.5a.75.75 0 0 0 1.06 0l2.5-2.5a.75.75 0 1 0-1.06-1.06l-1.22 1.22v-6.88l1.22 1.22a.75.75 0 1 0 1.06-1.06z"/></svg> </template>
CSS
.icon-ink-stroke-arrow-up-down-24-regular {
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%22M3.253%202.93a.75.75%200%200%201%20.817-.677l3.745.35c2.652.263%205.193.58%207.278.94c2.047.352%203.764.761%204.688%201.249a2.3%202.3%200%200%201%20.662.492c.192.22.362.552.29.957c-.066.372-.307.632-.52.8a3.5%203.5%200%200%201-.818.452c-1.234.511-3.595%201.005-7.328%201.493c-2.38.312-3.895.615-4.758.89l.077.023c.41.121.934.24%201.548.353c1.226.225%202.768.418%204.404.564c1.24.111%202.567.287%203.697.51q.28.056.548.116l-1.274%201.274a37%2037%200%200%200-3.105-.406c-1.662-.149-3.254-.346-4.541-.583a17%2017%200%200%201-1.703-.39c-.461-.137-.9-.304-1.212-.525a1.3%201.3%200%200%201-.46-.542a1%201%200%200%201%20.06-.901c.134-.232.338-.39.516-.5c.187-.116.411-.218.66-.31c.977-.363%202.705-.714%205.348-1.06c3.749-.49%205.922-.966%206.95-1.392l.125-.055c-.732-.34-2.16-.696-4.108-1.032c-2.037-.35-4.537-.663-7.17-.924l-3.739-.35a.75.75%200%200%201-.677-.816m12.333%2010.776a1.75%201.75%200%200%200%20.19%201.488a60%2060%200%200%201-1.928.26c-2.618.312-4.217.71-5.11%201.116c-.448.203-.65.378-.73.483c-.05.064-.043.083-.039.097l.002.004c.015.06.081.194.287.391c.199.19.48.394.832.602c.702.415%201.601.797%202.466%201.093l3.246%201.046a.75.75%200%200%201-.46%201.428l-3.266-1.053c-.923-.316-1.928-.737-2.749-1.222a6%206%200%200%201-1.106-.81c-.303-.29-.587-.656-.702-1.097c-.126-.485-.022-.971.297-1.39c.293-.384.748-.687%201.302-.938c1.111-.505%202.9-.923%205.552-1.24q1.079-.13%201.916-.258m4.694-2.486a.75.75%200%200%200-1.06%200l-2.5%202.5a.75.75%200%201%200%201.06%201.06L19%2013.56v6.88l-1.22-1.22a.75.75%200%201%200-1.06%201.06l2.5%202.5a.75.75%200%200%200%201.06%200l2.5-2.5a.75.75%200%201%200-1.06-1.06l-1.22%201.22v-6.88l1.22%201.22a.75.75%200%201%200%201.06-1.06z%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%22M3.253%202.93a.75.75%200%200%201%20.817-.677l3.745.35c2.652.263%205.193.58%207.278.94c2.047.352%203.764.761%204.688%201.249a2.3%202.3%200%200%201%20.662.492c.192.22.362.552.29.957c-.066.372-.307.632-.52.8a3.5%203.5%200%200%201-.818.452c-1.234.511-3.595%201.005-7.328%201.493c-2.38.312-3.895.615-4.758.89l.077.023c.41.121.934.24%201.548.353c1.226.225%202.768.418%204.404.564c1.24.111%202.567.287%203.697.51q.28.056.548.116l-1.274%201.274a37%2037%200%200%200-3.105-.406c-1.662-.149-3.254-.346-4.541-.583a17%2017%200%200%201-1.703-.39c-.461-.137-.9-.304-1.212-.525a1.3%201.3%200%200%201-.46-.542a1%201%200%200%201%20.06-.901c.134-.232.338-.39.516-.5c.187-.116.411-.218.66-.31c.977-.363%202.705-.714%205.348-1.06c3.749-.49%205.922-.966%206.95-1.392l.125-.055c-.732-.34-2.16-.696-4.108-1.032c-2.037-.35-4.537-.663-7.17-.924l-3.739-.35a.75.75%200%200%201-.677-.816m12.333%2010.776a1.75%201.75%200%200%200%20.19%201.488a60%2060%200%200%201-1.928.26c-2.618.312-4.217.71-5.11%201.116c-.448.203-.65.378-.73.483c-.05.064-.043.083-.039.097l.002.004c.015.06.081.194.287.391c.199.19.48.394.832.602c.702.415%201.601.797%202.466%201.093l3.246%201.046a.75.75%200%200%201-.46%201.428l-3.266-1.053c-.923-.316-1.928-.737-2.749-1.222a6%206%200%200%201-1.106-.81c-.303-.29-.587-.656-.702-1.097c-.126-.485-.022-.971.297-1.39c.293-.384.748-.687%201.302-.938c1.111-.505%202.9-.923%205.552-1.24q1.079-.13%201.916-.258m4.694-2.486a.75.75%200%200%200-1.06%200l-2.5%202.5a.75.75%200%201%200%201.06%201.06L19%2013.56v6.88l-1.22-1.22a.75.75%200%201%200-1.06%201.06l2.5%202.5a.75.75%200%200%200%201.06%200l2.5-2.5a.75.75%200%201%200-1.06-1.06l-1.22%201.22v-6.88l1.22%201.22a.75.75%200%201%200%201.06-1.06z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fluent/ink-stroke-arrow-up-down-24-regular.svg?color=%231a73e8&size=48
