md switch icon
md-switch from IonIcons by Ben Sperry · Regular · MIT Free for personal and commercial use.
- Name
- md-switch
- Set
- IonIcons
- Style
- Regular
- Viewbox
- 512×512
- License
- MIT
Related icons in IonIcons
md-addmd-add-circlemd-airplanemd-alarmmd-albumsmd-alertmd-american-footballmd-analyticsmd-aperturemd-appsmd-appstoremd-archivemd-arrow-backmd-arrow-downmd-arrow-dropdownmd-arrow-dropdown-circlemd-arrow-dropleftmd-arrow-dropleft-circlemd-arrow-droprightmd-arrow-dropright-circlemd-arrow-dropupmd-arrow-dropup-circlemd-arrow-forwardmd-arrow-round-back
Use the md switch icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M168 216h94.9c14.5 14.8 34.7 24 57.1 24 44.2 0 80-35.8 80-80s-35.8-80-80-80c-22.4 0-42.6 9.2-57.1 24H168c-30.8 0-56 25.2-56 56s25.2 56 56 56zm-16.9-72.9c4.6-4.6 10.6-7.1 16.9-7.1h75.7c-2.4 7.6-3.7 15.6-3.7 24s1.3 16.4 3.7 24H168c-6.3 0-12.4-2.5-16.9-7.1-4.6-4.6-7.1-10.6-7.1-16.9s2.5-12.4 7.1-16.9z" fill="currentColor"/><path d="M344 296h-94.9c-14.5-14.8-34.7-24-57.1-24-44.2 0-80 35.8-80 80s35.8 80 80 80c22.4 0 42.6-9.2 57.1-24H344c30.8 0 56-25.2 56-56s-25.2-56-56-56zm16.9 72.9c-4.6 4.6-10.6 7.1-16.9 7.1h-75.7c2.4-7.6 3.7-15.6 3.7-24s-1.3-16.4-3.7-24H344c6.3 0 12.4 2.5 16.9 7.1 4.6 4.6 7.1 10.6 7.1 16.9s-2.5 12.4-7.1 16.9z" fill="currentColor"/></svg>
React
import type { SVGProps } from "react";
export function IonMdSwitch(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M168 216h94.9c14.5 14.8 34.7 24 57.1 24 44.2 0 80-35.8 80-80s-35.8-80-80-80c-22.4 0-42.6 9.2-57.1 24H168c-30.8 0-56 25.2-56 56s25.2 56 56 56zm-16.9-72.9c4.6-4.6 10.6-7.1 16.9-7.1h75.7c-2.4 7.6-3.7 15.6-3.7 24s1.3 16.4 3.7 24H168c-6.3 0-12.4-2.5-16.9-7.1-4.6-4.6-7.1-10.6-7.1-16.9s2.5-12.4 7.1-16.9z" fill="currentColor"/><path d="M344 296h-94.9c-14.5-14.8-34.7-24-57.1-24-44.2 0-80 35.8-80 80s35.8 80 80 80c22.4 0 42.6-9.2 57.1-24H344c30.8 0 56-25.2 56-56s-25.2-56-56-56zm16.9 72.9c-4.6 4.6-10.6 7.1-16.9 7.1h-75.7c2.4-7.6 3.7-15.6 3.7-24s-1.3-16.4-3.7-24H344c6.3 0 12.4 2.5 16.9 7.1 4.6 4.6 7.1 10.6 7.1 16.9s-2.5 12.4-7.1 16.9z" fill="currentColor"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path d="M168 216h94.9c14.5 14.8 34.7 24 57.1 24 44.2 0 80-35.8 80-80s-35.8-80-80-80c-22.4 0-42.6 9.2-57.1 24H168c-30.8 0-56 25.2-56 56s25.2 56 56 56zm-16.9-72.9c4.6-4.6 10.6-7.1 16.9-7.1h75.7c-2.4 7.6-3.7 15.6-3.7 24s1.3 16.4 3.7 24H168c-6.3 0-12.4-2.5-16.9-7.1-4.6-4.6-7.1-10.6-7.1-16.9s2.5-12.4 7.1-16.9z" fill="currentColor"/><path d="M344 296h-94.9c-14.5-14.8-34.7-24-57.1-24-44.2 0-80 35.8-80 80s35.8 80 80 80c22.4 0 42.6-9.2 57.1-24H344c30.8 0 56-25.2 56-56s-25.2-56-56-56zm16.9 72.9c-4.6 4.6-10.6 7.1-16.9 7.1h-75.7c2.4-7.6 3.7-15.6 3.7-24s-1.3-16.4-3.7-24H344c6.3 0 12.4 2.5 16.9 7.1 4.6 4.6 7.1 10.6 7.1 16.9s-2.5 12.4-7.1 16.9z" fill="currentColor"/></svg> </template>
CSS
.icon-md-switch {
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%20512%20512%22%3E%3Cpath%20d%3D%22M168%20216h94.9c14.5%2014.8%2034.7%2024%2057.1%2024%2044.2%200%2080-35.8%2080-80s-35.8-80-80-80c-22.4%200-42.6%209.2-57.1%2024H168c-30.8%200-56%2025.2-56%2056s25.2%2056%2056%2056zm-16.9-72.9c4.6-4.6%2010.6-7.1%2016.9-7.1h75.7c-2.4%207.6-3.7%2015.6-3.7%2024s1.3%2016.4%203.7%2024H168c-6.3%200-12.4-2.5-16.9-7.1-4.6-4.6-7.1-10.6-7.1-16.9s2.5-12.4%207.1-16.9z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M344%20296h-94.9c-14.5-14.8-34.7-24-57.1-24-44.2%200-80%2035.8-80%2080s35.8%2080%2080%2080c22.4%200%2042.6-9.2%2057.1-24H344c30.8%200%2056-25.2%2056-56s-25.2-56-56-56zm16.9%2072.9c-4.6%204.6-10.6%207.1-16.9%207.1h-75.7c2.4-7.6%203.7-15.6%203.7-24s-1.3-16.4-3.7-24H344c6.3%200%2012.4%202.5%2016.9%207.1%204.6%204.6%207.1%2010.6%207.1%2016.9s-2.5%2012.4-7.1%2016.9z%22%20fill%3D%22currentColor%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%20512%20512%22%3E%3Cpath%20d%3D%22M168%20216h94.9c14.5%2014.8%2034.7%2024%2057.1%2024%2044.2%200%2080-35.8%2080-80s-35.8-80-80-80c-22.4%200-42.6%209.2-57.1%2024H168c-30.8%200-56%2025.2-56%2056s25.2%2056%2056%2056zm-16.9-72.9c4.6-4.6%2010.6-7.1%2016.9-7.1h75.7c-2.4%207.6-3.7%2015.6-3.7%2024s1.3%2016.4%203.7%2024H168c-6.3%200-12.4-2.5-16.9-7.1-4.6-4.6-7.1-10.6-7.1-16.9s2.5-12.4%207.1-16.9z%22%20fill%3D%22currentColor%22%2F%3E%3Cpath%20d%3D%22M344%20296h-94.9c-14.5-14.8-34.7-24-57.1-24-44.2%200-80%2035.8-80%2080s35.8%2080%2080%2080c22.4%200%2042.6-9.2%2057.1-24H344c30.8%200%2056-25.2%2056-56s-25.2-56-56-56zm16.9%2072.9c-4.6%204.6-10.6%207.1-16.9%207.1h-75.7c2.4-7.6%203.7-15.6%203.7-24s-1.3-16.4-3.7-24H344c6.3%200%2012.4%202.5%2016.9%207.1%204.6%204.6%207.1%2010.6%207.1%2016.9s-2.5%2012.4-7.1%2016.9z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ion/md-switch.svg?color=%231a73e8&size=48
