effect logo
effect from Simple Icons by Simple Icons Collaborators · Brand · CC0-1.0 Free for personal and commercial use.
- Name
- effect
- Set
- Simple Icons
- Style
- Brand
- Viewbox
- 24×24
- License
- CC0 1.0
The same logo in other sets
Use the effect logo
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.846.007a.8.8 0 0 0-.312.103L.454 6.346a.8.8 0 0 0-.397.855a.8.8 0 0 0 .408.78L3.99 9.976L1.033 11.64a.76.76 0 0 0-.374.838c-.033.265.07.541.378.715l10.546 5.967a.8.8 0 0 0 .61.073a.8.8 0 0 0 .27-.094l10.548-5.968c.31-.175.412-.454.376-.72a.76.76 0 0 0-.383-.79l-3.01-1.693l3.554-2.012a.8.8 0 0 0 .399-.836a.8.8 0 0 0-.412-.753L12.455.13a.8.8 0 0 0-.28-.097a.8.8 0 0 0-.227-.033m6.482 10.853l2.78 1.566l-9.205 5.21l-9.21-5.213l2.76-1.554l5.99 3.387a.83.83 0 0 0 .638.076a.8.8 0 0 0 .285-.098zm3.572 6.03a.75.75 0 0 0-.35.098l-9.67 5.47l-9.635-5.45a.75.75 0 0 0-1.01.267a.717.717 0 0 0 .27.99l9.976 5.644a.75.75 0 0 0 .372.098c.079 0 .294-.026.46-.117l9.978-5.645a.716.716 0 0 0 .27-.99a.75.75 0 0 0-.661-.364"/></svg>
React
import type { SVGProps } from "react";
export function SimpleIconsEffect(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="M11.846.007a.8.8 0 0 0-.312.103L.454 6.346a.8.8 0 0 0-.397.855a.8.8 0 0 0 .408.78L3.99 9.976L1.033 11.64a.76.76 0 0 0-.374.838c-.033.265.07.541.378.715l10.546 5.967a.8.8 0 0 0 .61.073a.8.8 0 0 0 .27-.094l10.548-5.968c.31-.175.412-.454.376-.72a.76.76 0 0 0-.383-.79l-3.01-1.693l3.554-2.012a.8.8 0 0 0 .399-.836a.8.8 0 0 0-.412-.753L12.455.13a.8.8 0 0 0-.28-.097a.8.8 0 0 0-.227-.033m6.482 10.853l2.78 1.566l-9.205 5.21l-9.21-5.213l2.76-1.554l5.99 3.387a.83.83 0 0 0 .638.076a.8.8 0 0 0 .285-.098zm3.572 6.03a.75.75 0 0 0-.35.098l-9.67 5.47l-9.635-5.45a.75.75 0 0 0-1.01.267a.717.717 0 0 0 .27.99l9.976 5.644a.75.75 0 0 0 .372.098c.079 0 .294-.026.46-.117l9.978-5.645a.716.716 0 0 0 .27-.99a.75.75 0 0 0-.661-.364"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24"><path fill="currentColor" d="M11.846.007a.8.8 0 0 0-.312.103L.454 6.346a.8.8 0 0 0-.397.855a.8.8 0 0 0 .408.78L3.99 9.976L1.033 11.64a.76.76 0 0 0-.374.838c-.033.265.07.541.378.715l10.546 5.967a.8.8 0 0 0 .61.073a.8.8 0 0 0 .27-.094l10.548-5.968c.31-.175.412-.454.376-.72a.76.76 0 0 0-.383-.79l-3.01-1.693l3.554-2.012a.8.8 0 0 0 .399-.836a.8.8 0 0 0-.412-.753L12.455.13a.8.8 0 0 0-.28-.097a.8.8 0 0 0-.227-.033m6.482 10.853l2.78 1.566l-9.205 5.21l-9.21-5.213l2.76-1.554l5.99 3.387a.83.83 0 0 0 .638.076a.8.8 0 0 0 .285-.098zm3.572 6.03a.75.75 0 0 0-.35.098l-9.67 5.47l-9.635-5.45a.75.75 0 0 0-1.01.267a.717.717 0 0 0 .27.99l9.976 5.644a.75.75 0 0 0 .372.098c.079 0 .294-.026.46-.117l9.978-5.645a.716.716 0 0 0 .27-.99a.75.75 0 0 0-.661-.364"/></svg> </template>
CSS
.icon-effect {
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%22M11.846.007a.8.8%200%200%200-.312.103L.454%206.346a.8.8%200%200%200-.397.855a.8.8%200%200%200%20.408.78L3.99%209.976L1.033%2011.64a.76.76%200%200%200-.374.838c-.033.265.07.541.378.715l10.546%205.967a.8.8%200%200%200%20.61.073a.8.8%200%200%200%20.27-.094l10.548-5.968c.31-.175.412-.454.376-.72a.76.76%200%200%200-.383-.79l-3.01-1.693l3.554-2.012a.8.8%200%200%200%20.399-.836a.8.8%200%200%200-.412-.753L12.455.13a.8.8%200%200%200-.28-.097a.8.8%200%200%200-.227-.033m6.482%2010.853l2.78%201.566l-9.205%205.21l-9.21-5.213l2.76-1.554l5.99%203.387a.83.83%200%200%200%20.638.076a.8.8%200%200%200%20.285-.098zm3.572%206.03a.75.75%200%200%200-.35.098l-9.67%205.47l-9.635-5.45a.75.75%200%200%200-1.01.267a.717.717%200%200%200%20.27.99l9.976%205.644a.75.75%200%200%200%20.372.098c.079%200%20.294-.026.46-.117l9.978-5.645a.716.716%200%200%200%20.27-.99a.75.75%200%200%200-.661-.364%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%22M11.846.007a.8.8%200%200%200-.312.103L.454%206.346a.8.8%200%200%200-.397.855a.8.8%200%200%200%20.408.78L3.99%209.976L1.033%2011.64a.76.76%200%200%200-.374.838c-.033.265.07.541.378.715l10.546%205.967a.8.8%200%200%200%20.61.073a.8.8%200%200%200%20.27-.094l10.548-5.968c.31-.175.412-.454.376-.72a.76.76%200%200%200-.383-.79l-3.01-1.693l3.554-2.012a.8.8%200%200%200%20.399-.836a.8.8%200%200%200-.412-.753L12.455.13a.8.8%200%200%200-.28-.097a.8.8%200%200%200-.227-.033m6.482%2010.853l2.78%201.566l-9.205%205.21l-9.21-5.213l2.76-1.554l5.99%203.387a.83.83%200%200%200%20.638.076a.8.8%200%200%200%20.285-.098zm3.572%206.03a.75.75%200%200%200-.35.098l-9.67%205.47l-9.635-5.45a.75.75%200%200%200-1.01.267a.717.717%200%200%200%20.27.99l9.976%205.644a.75.75%200%200%200%20.372.098c.079%200%20.294-.026.46-.117l9.978-5.645a.716.716%200%200%200%20.27-.99a.75.75%200%200%200-.661-.364%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/simple-icons/effect.svg?color=%231a73e8&size=48
