variable icon
variable from Material Design Icons by Pictogrammers · Filled · Developer / Languages · Apache-2.0 Free for personal and commercial use.
- Name
- variable
- Set
- Material Design Icons
- Style
- Filled
- Category
- Developer / Languages
- Viewbox
- 24×24
- License
- Apache 2.0
The same icon in other sets
More developer / languages icons from Material Design Icons
ab-testingapiapi-offapplication-arrayapplication-bracesapplication-bracketsapplication-parenthesesapplication-variablebashcode-arraycode-block-bracescode-block-bracketscode-block-parenthesescode-block-tagscode-bracescode-braces-boxcode-bracketscode-equalcode-greater-thancode-greater-than-or-equalcode-jsoncode-less-thancode-less-than-or-equalcode-not-equal
Use the variable icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20.41 3c1.39 2.71 1.94 5.84 1.59 9c-.2 3.16-1.3 6.29-3.17 9l-1.53-1c1.61-2.43 2.55-5.2 2.7-8c.34-2.8-.11-5.57-1.3-8zM5.17 3L6.7 4C5.09 6.43 4.15 9.2 4 12c-.34 2.8.12 5.57 1.3 8l-1.69 1c-1.4-2.71-1.96-5.83-1.61-9c.2-3.16 1.3-6.29 3.17-9m6.91 7.68l2.32-3.23h2.53l-3.78 5l2.2 4.92h-2.26L11.71 14l-2.43 3.33H6.76l3.9-5.12l-2.13-4.76h2.27z"/></svg>
React
import type { SVGProps } from "react";
export function MdiVariable(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="M20.41 3c1.39 2.71 1.94 5.84 1.59 9c-.2 3.16-1.3 6.29-3.17 9l-1.53-1c1.61-2.43 2.55-5.2 2.7-8c.34-2.8-.11-5.57-1.3-8zM5.17 3L6.7 4C5.09 6.43 4.15 9.2 4 12c-.34 2.8.12 5.57 1.3 8l-1.69 1c-1.4-2.71-1.96-5.83-1.61-9c.2-3.16 1.3-6.29 3.17-9m6.91 7.68l2.32-3.23h2.53l-3.78 5l2.2 4.92h-2.26L11.71 14l-2.43 3.33H6.76l3.9-5.12l-2.13-4.76h2.27z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M20.41 3c1.39 2.71 1.94 5.84 1.59 9c-.2 3.16-1.3 6.29-3.17 9l-1.53-1c1.61-2.43 2.55-5.2 2.7-8c.34-2.8-.11-5.57-1.3-8zM5.17 3L6.7 4C5.09 6.43 4.15 9.2 4 12c-.34 2.8.12 5.57 1.3 8l-1.69 1c-1.4-2.71-1.96-5.83-1.61-9c.2-3.16 1.3-6.29 3.17-9m6.91 7.68l2.32-3.23h2.53l-3.78 5l2.2 4.92h-2.26L11.71 14l-2.43 3.33H6.76l3.9-5.12l-2.13-4.76h2.27z"/></svg> </template>
CSS
.icon-variable {
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%22M20.41%203c1.39%202.71%201.94%205.84%201.59%209c-.2%203.16-1.3%206.29-3.17%209l-1.53-1c1.61-2.43%202.55-5.2%202.7-8c.34-2.8-.11-5.57-1.3-8zM5.17%203L6.7%204C5.09%206.43%204.15%209.2%204%2012c-.34%202.8.12%205.57%201.3%208l-1.69%201c-1.4-2.71-1.96-5.83-1.61-9c.2-3.16%201.3-6.29%203.17-9m6.91%207.68l2.32-3.23h2.53l-3.78%205l2.2%204.92h-2.26L11.71%2014l-2.43%203.33H6.76l3.9-5.12l-2.13-4.76h2.27z%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%22M20.41%203c1.39%202.71%201.94%205.84%201.59%209c-.2%203.16-1.3%206.29-3.17%209l-1.53-1c1.61-2.43%202.55-5.2%202.7-8c.34-2.8-.11-5.57-1.3-8zM5.17%203L6.7%204C5.09%206.43%204.15%209.2%204%2012c-.34%202.8.12%205.57%201.3%208l-1.69%201c-1.4-2.71-1.96-5.83-1.61-9c.2-3.16%201.3-6.29%203.17-9m6.91%207.68l2.32-3.23h2.53l-3.78%205l2.2%204.92h-2.26L11.71%2014l-2.43%203.33H6.76l3.9-5.12l-2.13-4.76h2.27z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mdi/variable.svg?color=%231a73e8&size=48