steppers icon

steppers from Material Symbols Light by Google · Regular · UI Actions · Apache-2.0 Free for personal and commercial use.

Name: steppers
Set: Material Symbols Light
Style: Regular
Category: UI Actions
Viewbox: 24×24
License: Apache 2.0
Aliases: steppers-outline, steppers-outline-rounded, steppers-outline-sharp, steppers-rounded, steppers-sharp

The same icon in other sets

steppersMaterial Symbols

More ui actions icons from Material Symbols Light

Use the steppers icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M4.192 13.582q-.653-.65-.653-1.578q0-.927.649-1.581t1.577-.654t1.581.65T8 11.995t-.65 1.582t-1.576.654t-1.582-.65m2.453-.704Q7 12.524 7 12.001t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704q-.654-.649-.654-1.576q0-.928.65-1.582q.649-.654 1.576-.654q.928 0 1.582.65q.654.649.654 1.576q0 .928-.65 1.582q-.649.654-1.576.654q-.928 0-1.582-.65m2.453-.704q.355-.353.355-.876t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704Q16 12.933 16 12.006q0-.928.65-1.582q.649-.654 1.576-.654t1.582.65t.653 1.576t-.649 1.582t-1.577.654t-1.581-.65"/></svg>

React

import type { SVGProps } from "react";

export function MaterialSymbolsLightSteppers(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.192 13.582q-.653-.65-.653-1.578q0-.927.649-1.581t1.577-.654t1.581.65T8 11.995t-.65 1.582t-1.576.654t-1.582-.65m2.453-.704Q7 12.524 7 12.001t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704q-.654-.649-.654-1.576q0-.928.65-1.582q.649-.654 1.576-.654q.928 0 1.582.65q.654.649.654 1.576q0 .928-.65 1.582q-.649.654-1.576.654q-.928 0-1.582-.65m2.453-.704q.355-.353.355-.876t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704Q16 12.933 16 12.006q0-.928.65-1.582q.649-.654 1.576-.654t1.582.65t.653 1.576t-.649 1.582t-1.577.654t-1.581-.65"/></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.192 13.582q-.653-.65-.653-1.578q0-.927.649-1.581t1.577-.654t1.581.65T8 11.995t-.65 1.582t-1.576.654t-1.582-.65m2.453-.704Q7 12.524 7 12.001t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704q-.654-.649-.654-1.576q0-.928.65-1.582q.649-.654 1.576-.654q.928 0 1.582.65q.654.649.654 1.576q0 .928-.65 1.582q-.649.654-1.576.654q-.928 0-1.582-.65m2.453-.704q.355-.353.355-.876t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704Q16 12.933 16 12.006q0-.928.65-1.582q.649-.654 1.576-.654t1.582.65t.653 1.576t-.649 1.582t-1.577.654t-1.581-.65"/></svg>
</template>

CSS

.icon-steppers {
  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.192%2013.582q-.653-.65-.653-1.578q0-.927.649-1.581t1.577-.654t1.581.65T8%2011.995t-.65%201.582t-1.576.654t-1.582-.65m2.453-.704Q7%2012.524%207%2012.001t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704q-.654-.649-.654-1.576q0-.928.65-1.582q.649-.654%201.576-.654q.928%200%201.582.65q.654.649.654%201.576q0%20.928-.65%201.582q-.649.654-1.576.654q-.928%200-1.582-.65m2.453-.704q.355-.353.355-.876t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704Q16%2012.933%2016%2012.006q0-.928.65-1.582q.649-.654%201.576-.654t1.582.65t.653%201.576t-.649%201.582t-1.577.654t-1.581-.65%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.192%2013.582q-.653-.65-.653-1.578q0-.927.649-1.581t1.577-.654t1.581.65T8%2011.995t-.65%201.582t-1.576.654t-1.582-.65m2.453-.704Q7%2012.524%207%2012.001t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704q-.654-.649-.654-1.576q0-.928.65-1.582q.649-.654%201.576-.654q.928%200%201.582.65q.654.649.654%201.576q0%20.928-.65%201.582q-.649.654-1.576.654q-.928%200-1.582-.65m2.453-.704q.355-.353.355-.876t-.354-.877t-.876-.355t-.877.354t-.355.876t.354.877t.876.355t.877-.354m3.778.704Q16%2012.933%2016%2012.006q0-.928.65-1.582q.649-.654%201.576-.654t1.582.65t.653%201.576t-.649%201.582t-1.577.654t-1.581-.65%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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