3d rotation icon
3d-rotation-sharp from Material Symbols Light by Google · Sharp · Actions · Apache-2.0 Free for personal and commercial use.
- Name
- 3d-rotation-sharp
- Set
- Material Symbols Light
- Style
- Sharp
- Category
- Actions
- Viewbox
- 24×24
- License
- Apache 2.0
- Aliases
- 3d-rotation-outline-sharp
3 other variants in Material Symbols Light
The same icon in other sets
More actions icons from Material Symbols Light
Use the 3d rotation icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 21q-1.868 0-3.51-.709t-2.857-1.923t-1.924-2.858T3 12h1q0 3.125 2.091 5.402t5.205 2.564L9.731 18.4l.708-.708l3.127 3.127q-.38.097-.78.139T12 21m.808-6.308V9.308h3l.769.769v3.846l-.77.77zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884h3.77v5.384zm6.27-.884h2v-3.616h-2zM20 12q0-3.125-2.091-5.402t-5.205-2.564L14.269 5.6l-.708.708l-3.127-3.127q.38-.096.78-.139T12 3q1.868 0 3.51.709t2.858 1.924T20.29 8.49T21 12z"/></svg>
React
import type { SVGProps } from "react";
export function MaterialSymbolsLight3dRotationSharp(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="M12 21q-1.868 0-3.51-.709t-2.857-1.923t-1.924-2.858T3 12h1q0 3.125 2.091 5.402t5.205 2.564L9.731 18.4l.708-.708l3.127 3.127q-.38.097-.78.139T12 21m.808-6.308V9.308h3l.769.769v3.846l-.77.77zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884h3.77v5.384zm6.27-.884h2v-3.616h-2zM20 12q0-3.125-2.091-5.402t-5.205-2.564L14.269 5.6l-.708.708l-3.127-3.127q.38-.096.78-.139T12 3q1.868 0 3.51.709t2.858 1.924T20.29 8.49T21 12z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 21q-1.868 0-3.51-.709t-2.857-1.923t-1.924-2.858T3 12h1q0 3.125 2.091 5.402t5.205 2.564L9.731 18.4l.708-.708l3.127 3.127q-.38.097-.78.139T12 21m.808-6.308V9.308h3l.769.769v3.846l-.77.77zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884h3.77v5.384zm6.27-.884h2v-3.616h-2zM20 12q0-3.125-2.091-5.402t-5.205-2.564L14.269 5.6l-.708.708l-3.127-3.127q.38-.096.78-.139T12 3q1.868 0 3.51.709t2.858 1.924T20.29 8.49T21 12z"/></svg> </template>
CSS
.icon-3d-rotation-sharp {
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%22M12%2021q-1.868%200-3.51-.709t-2.857-1.923t-1.924-2.858T3%2012h1q0%203.125%202.091%205.402t5.205%202.564L9.731%2018.4l.708-.708l3.127%203.127q-.38.097-.78.139T12%2021m.808-6.308V9.308h3l.769.769v3.846l-.77.77zm-5.385%200v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884h3.77v5.384zm6.27-.884h2v-3.616h-2zM20%2012q0-3.125-2.091-5.402t-5.205-2.564L14.269%205.6l-.708.708l-3.127-3.127q.38-.096.78-.139T12%203q1.868%200%203.51.709t2.858%201.924T20.29%208.49T21%2012z%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%22M12%2021q-1.868%200-3.51-.709t-2.857-1.923t-1.924-2.858T3%2012h1q0%203.125%202.091%205.402t5.205%202.564L9.731%2018.4l.708-.708l3.127%203.127q-.38.097-.78.139T12%2021m.808-6.308V9.308h3l.769.769v3.846l-.77.77zm-5.385%200v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884h3.77v5.384zm6.27-.884h2v-3.616h-2zM20%2012q0-3.125-2.091-5.402t-5.205-2.564L14.269%205.6l-.708.708l-3.127-3.127q.38-.096.78-.139T12%203q1.868%200%203.51.709t2.858%201.924T20.29%208.49T21%2012z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/material-symbols-light/3d-rotation-sharp.svg?color=%231a73e8&size=48