3d-rotation from Material Symbols Light by Google · Regular · Actions · Apache-2.0 Free for personal and commercial use.

Name
3d-rotation
Set
Material Symbols Light
Style
Regular
Category
Actions
Viewbox
24×24
License
Apache 2.0
Aliases
3d-rotation-outline

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.308h2.769q.425 0 .712.287t.288.713v3.384q0 .425-.288.713t-.712.287zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884H10.5q.294 0 .493.199t.2.493v4q0 .294-.2.493t-.493.2zm6.27-.884h1.769q.115 0 .173-.058t.057-.173v-3.154q0-.115-.058-.173q-.057-.058-.173-.058h-1.769zM20 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 MaterialSymbolsLight3dRotation(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.308h2.769q.425 0 .712.287t.288.713v3.384q0 .425-.288.713t-.712.287zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884H10.5q.294 0 .493.199t.2.493v4q0 .294-.2.493t-.493.2zm6.27-.884h1.769q.115 0 .173-.058t.057-.173v-3.154q0-.115-.058-.173q-.057-.058-.173-.058h-1.769zM20 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.308h2.769q.425 0 .712.287t.288.713v3.384q0 .425-.288.713t-.712.287zm-5.385 0v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884H10.5q.294 0 .493.199t.2.493v4q0 .294-.2.493t-.493.2zm6.27-.884h1.769q.115 0 .173-.058t.057-.173v-3.154q0-.115-.058-.173q-.057-.058-.173-.058h-1.769zM20 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 {
  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.308h2.769q.425%200%20.712.287t.288.713v3.384q0%20.425-.288.713t-.712.287zm-5.385%200v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884H10.5q.294%200%20.493.199t.2.493v4q0%20.294-.2.493t-.493.2zm6.27-.884h1.769q.115%200%20.173-.058t.057-.173v-3.154q0-.115-.058-.173q-.057-.058-.173-.058h-1.769zM20%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.308h2.769q.425%200%20.712.287t.288.713v3.384q0%20.425-.288.713t-.712.287zm-5.385%200v-.884h2.885v-1.424H8.423v-.769h1.885v-1.423H7.423v-.884H10.5q.294%200%20.493.199t.2.493v4q0%20.294-.2.493t-.493.2zm6.27-.884h1.769q.115%200%20.173-.058t.057-.173v-3.154q0-.115-.058-.173q-.057-.058-.173-.058h-1.769zM20%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.svg?color=%231a73e8&size=48