controller icon
controller-solid from Myna UI Icons by Praveen Juge · Solid · MIT Free for personal and commercial use.
- Name
- controller-solid
- Set
- Myna UI Icons
- Style
- Solid
- Viewbox
- 24×24
- License
- MIT
1 other variant in Myna UI Icons
The same icon in other sets
Use the controller icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M12 3.032a.75.75 0 0 1 .75.75v3.715c.428-.109.867-.296 1.371-.51q.219-.094.455-.192c.952-.395 2.122-.801 3.441-.374c1.37.444 2.474 1.472 3.203 3.157c.718 1.66 1.081 3.97 1.024 7.062c-.023 1.255-.34 3.057-1.996 3.78c-1.789.782-3.198-.024-4.296-.774q-.253-.174-.483-.337c-.376-.265-.72-.507-1.089-.714c-.499-.28-.957-.44-1.431-.44H11.05c-.475 0-.935.16-1.435.44c-.37.207-.716.45-1.094.716q-.229.162-.48.334c-1.097.748-2.506 1.555-4.29.776c-1.656-.724-1.973-2.526-1.996-3.78c-.057-3.093.306-5.403 1.024-7.063c.73-1.685 1.833-2.713 3.203-3.157c1.32-.427 2.489-.02 3.441.374q.237.098.455.192c.504.214.943.401 1.371.51V3.782a.75.75 0 0 1 .75-.75M8.25 11.5a.75.75 0 0 0-1.5 0v.75H6a.75.75 0 0 0 0 1.5h.75v.75a.75.75 0 0 0 1.5 0v-.75H9a.75.75 0 0 0 0-1.5h-.75zm6.624.75a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5z"/></svg>
React
import type { SVGProps } from "react";
export function MynauiControllerSolid(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 3.032a.75.75 0 0 1 .75.75v3.715c.428-.109.867-.296 1.371-.51q.219-.094.455-.192c.952-.395 2.122-.801 3.441-.374c1.37.444 2.474 1.472 3.203 3.157c.718 1.66 1.081 3.97 1.024 7.062c-.023 1.255-.34 3.057-1.996 3.78c-1.789.782-3.198-.024-4.296-.774q-.253-.174-.483-.337c-.376-.265-.72-.507-1.089-.714c-.499-.28-.957-.44-1.431-.44H11.05c-.475 0-.935.16-1.435.44c-.37.207-.716.45-1.094.716q-.229.162-.48.334c-1.097.748-2.506 1.555-4.29.776c-1.656-.724-1.973-2.526-1.996-3.78c-.057-3.093.306-5.403 1.024-7.063c.73-1.685 1.833-2.713 3.203-3.157c1.32-.427 2.489-.02 3.441.374q.237.098.455.192c.504.214.943.401 1.371.51V3.782a.75.75 0 0 1 .75-.75M8.25 11.5a.75.75 0 0 0-1.5 0v.75H6a.75.75 0 0 0 0 1.5h.75v.75a.75.75 0 0 0 1.5 0v-.75H9a.75.75 0 0 0 0-1.5h-.75zm6.624.75a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5z"/></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 3.032a.75.75 0 0 1 .75.75v3.715c.428-.109.867-.296 1.371-.51q.219-.094.455-.192c.952-.395 2.122-.801 3.441-.374c1.37.444 2.474 1.472 3.203 3.157c.718 1.66 1.081 3.97 1.024 7.062c-.023 1.255-.34 3.057-1.996 3.78c-1.789.782-3.198-.024-4.296-.774q-.253-.174-.483-.337c-.376-.265-.72-.507-1.089-.714c-.499-.28-.957-.44-1.431-.44H11.05c-.475 0-.935.16-1.435.44c-.37.207-.716.45-1.094.716q-.229.162-.48.334c-1.097.748-2.506 1.555-4.29.776c-1.656-.724-1.973-2.526-1.996-3.78c-.057-3.093.306-5.403 1.024-7.063c.73-1.685 1.833-2.713 3.203-3.157c1.32-.427 2.489-.02 3.441.374q.237.098.455.192c.504.214.943.401 1.371.51V3.782a.75.75 0 0 1 .75-.75M8.25 11.5a.75.75 0 0 0-1.5 0v.75H6a.75.75 0 0 0 0 1.5h.75v.75a.75.75 0 0 0 1.5 0v-.75H9a.75.75 0 0 0 0-1.5h-.75zm6.624.75a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5z"/></svg> </template>
CSS
.icon-controller-solid {
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%203.032a.75.75%200%200%201%20.75.75v3.715c.428-.109.867-.296%201.371-.51q.219-.094.455-.192c.952-.395%202.122-.801%203.441-.374c1.37.444%202.474%201.472%203.203%203.157c.718%201.66%201.081%203.97%201.024%207.062c-.023%201.255-.34%203.057-1.996%203.78c-1.789.782-3.198-.024-4.296-.774q-.253-.174-.483-.337c-.376-.265-.72-.507-1.089-.714c-.499-.28-.957-.44-1.431-.44H11.05c-.475%200-.935.16-1.435.44c-.37.207-.716.45-1.094.716q-.229.162-.48.334c-1.097.748-2.506%201.555-4.29.776c-1.656-.724-1.973-2.526-1.996-3.78c-.057-3.093.306-5.403%201.024-7.063c.73-1.685%201.833-2.713%203.203-3.157c1.32-.427%202.489-.02%203.441.374q.237.098.455.192c.504.214.943.401%201.371.51V3.782a.75.75%200%200%201%20.75-.75M8.25%2011.5a.75.75%200%200%200-1.5%200v.75H6a.75.75%200%200%200%200%201.5h.75v.75a.75.75%200%200%200%201.5%200v-.75H9a.75.75%200%200%200%200-1.5h-.75zm6.624.75a.75.75%200%200%200%200%201.5h3a.75.75%200%200%200%200-1.5z%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%203.032a.75.75%200%200%201%20.75.75v3.715c.428-.109.867-.296%201.371-.51q.219-.094.455-.192c.952-.395%202.122-.801%203.441-.374c1.37.444%202.474%201.472%203.203%203.157c.718%201.66%201.081%203.97%201.024%207.062c-.023%201.255-.34%203.057-1.996%203.78c-1.789.782-3.198-.024-4.296-.774q-.253-.174-.483-.337c-.376-.265-.72-.507-1.089-.714c-.499-.28-.957-.44-1.431-.44H11.05c-.475%200-.935.16-1.435.44c-.37.207-.716.45-1.094.716q-.229.162-.48.334c-1.097.748-2.506%201.555-4.29.776c-1.656-.724-1.973-2.526-1.996-3.78c-.057-3.093.306-5.403%201.024-7.063c.73-1.685%201.833-2.713%203.203-3.157c1.32-.427%202.489-.02%203.441.374q.237.098.455.192c.504.214.943.401%201.371.51V3.782a.75.75%200%200%201%20.75-.75M8.25%2011.5a.75.75%200%200%200-1.5%200v.75H6a.75.75%200%200%200%200%201.5h.75v.75a.75.75%200%200%200%201.5%200v-.75H9a.75.75%200%200%200%200-1.5h-.75zm6.624.75a.75.75%200%200%200%200%201.5h3a.75.75%200%200%200%200-1.5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/mynaui/controller-solid.svg?color=%231a73e8&size=48
