Effect icon

logos:effect

The Effect icon (logos:effect) is a free SVG icon from the SVG Logos set by Gil Barbara. It is drawn on a 512 × 122 grid. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: SVG Logos
Author: Gil Barbara
License: CC0-1.0
Size: 512 × 122

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="122" viewBox="0 0 512 122"><path d="M113.81 92.547c1.805-1.017 2.422-3.269 1.381-5.03c-1.041-1.76-3.346-2.365-5.15-1.348l-49.239 27.763l-49.057-27.66c-1.802-1.017-4.108-.415-5.15 1.348c-1.04 1.762-.423 4.013 1.38 5.03l50.798 28.642a3.84 3.84 0 0 0 2.932.35a3.9 3.9 0 0 0 1.309-.452z"/><path d="M58.754 28.937a4.06 4.06 0 0 1 3.099-.366c.479.075.94.234 1.363.471l53.702 30.134c1.484.832 2.214 2.451 1.956 4.005c.182 1.352-.34 2.77-1.918 3.66L63.25 97.125a4 4 0 0 1-1.38.475a4.06 4.06 0 0 1-3.102-.368L5.067 66.95c-1.565-.883-2.09-2.285-1.922-3.625c-.385-1.627.342-3.377 1.904-4.254zm2.136 7.768L14.02 63.007L60.917 89.45l46.87-26.429z"/><path d="M61.778.162c.503.078.988.246 1.432.495l56.414 31.656a4.07 4.07 0 0 1 2.1 3.822c.294 1.643-.468 3.362-2.034 4.243L63.277 72.19c-.45.253-.942.422-1.452.498a4.27 4.27 0 0 1-3.258-.386L2.154 40.492a4.06 4.06 0 0 1-2.075-3.948C-.26 34.87.507 33.1 2.106 32.203L58.522.547a4.27 4.27 0 0 1 3.256-.385M343.02 35.36c10.468 0 19.24 3.532 26.284 10.589c6.92 6.932 10.566 16.371 10.944 28.292l.029 1.163H318.01l.001.018c.505 7.228 2.96 13.067 7.366 17.537l.334.333c4.729 4.621 10.359 6.926 16.917 6.926c11.027 0 19.464-5.314 25.362-15.995l.49-.906l10.014 5.126l-.245.45c-4.12 7.592-8.996 13.212-14.632 16.85c-5.643 3.643-12.384 5.463-20.208 5.463c-10.819 0-19.768-3.708-26.814-11.116c-7.038-7.401-10.561-16.323-10.561-26.742c0-10.418 3.545-19.363 10.626-26.806c7.088-7.451 15.885-11.182 26.358-11.182m87.953 0q10.543 0 19.45 4.596c5.944 3.069 10.596 7.37 13.945 12.898l.254.42l-9.27 5.82l-.277-.358c-6.247-8.094-14.398-12.13-24.493-12.13c-7.954 0-14.607 2.527-19.985 7.584c-5.372 5.05-8.052 11.296-8.052 18.769c0 7.479 2.64 13.881 7.935 19.236c5.29 5.35 11.98 8.023 20.102 8.023c9.75 0 17.949-4.08 24.632-12.269l.29-.355l9.131 6.25l-.283.411q-5.68 8.284-14.858 12.622q-9.159 4.329-19.824 4.329c-11.074 0-20.343-3.638-27.778-10.909c-7.437-7.272-11.161-16.178-11.161-26.69c0-10.51 3.744-19.522 11.221-27.01c7.481-7.49 17.164-11.237 29.021-11.237m66.956-24.78v26.592H512v10.34l-14.072-.001l.001 49.053c0 1.567.208 2.536.52 2.856l.056.05c.385.285 1.512.465 3.307.484l7.057.001v10.133l-.418.07c-4.186.695-7.386 1.044-9.592 1.044c-4.293 0-7.501-1.057-9.605-3.198c-2.103-2.139-3.14-5.484-3.14-10.013l-.001-50.48h-12.248V37.173l12.248-.001V10.58zm-250.95 0q4.077.001 10.894 1.81l.941.254V24.54l-.69-.287c-4.116-1.706-7.315-2.556-9.582-2.556c-2.168 0-3.504.665-4.107 1.98c-.658 1.432-.997 3.9-.997 7.38l-.001 6.115H257.9v10.34l-14.465-.001v61.357h-11.813V47.51h-8.992V37.173l8.991-.001v-7.543c0-6.315 1.153-11.023 3.485-14.117l.208-.27c2.493-3.112 6.395-4.661 11.662-4.661m-31.295 2.336V24.94H171.38v26.242h43.913v11.895H171.38V96.84l43.913.001v12.025h-56.118v-95.95zm72.219-2.335c2.72 0 6.348.604 10.895 1.81l.941.253V24.54l-.69-.287c-4.115-1.706-7.316-2.556-9.582-2.556c-2.167 0-3.503.665-4.107 1.98c-.63 1.372-.968 3.695-.995 6.95l-.002 6.545h14.464v10.34l-14.464-.001v61.357h-11.81V47.51h-8.991V37.173l8.99-.001l.001-7.543c0-6.316 1.153-11.024 3.484-14.117l.209-.27c2.493-3.112 6.394-4.661 11.661-4.661m55.116 36.156c-11.5 0-19.246 5.803-23.314 17.495l-.238.704h47.684l-.097-.4c-1.336-5.29-4.018-9.467-8.05-12.551l-.382-.286c-4.517-3.31-9.713-4.962-15.603-4.962"/></svg>

How to use the Effect icon

React

import { Icon } from "@iconify/react";

<Icon icon="logos:effect" width="24" />

Vue

<script setup>
import { Icon } from "@iconify/vue";
</script>

<template>
  <Icon icon="logos:effect" width="24" />
</template>

Svelte

<script>
  import Icon from "@iconify/svelte";
</script>

<Icon icon="logos:effect" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[logos--effect]"></span>

UnoCSS

<!-- @unocss/preset-icons + @iconify-json/logos -->
<div class="i-logos:effect"></div>

Web component

<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>

<iconify-icon icon="logos:effect"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/logos/effect.svg" alt="Effect icon" width="24" height="24">

Related icons in SVG Logos

Effect icon in other icon sets

Effect icon FAQ

Is the Effect icon free for commercial use?

Yes. SVG Logos icons are released under the CC0 license, which allows use in personal and commercial projects.

How do I use the Effect icon in React?

Install @iconify/react and render <Icon icon="logos:effect" />, or use “Copy code” on this page to get a standalone React component.

How do I add the Effect icon to a web page?

Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/logos/effect.svg" alt="Effect icon">, or paste the SVG code inline to style it with CSS.

Browse all SVG Logos icons →