Electron icon

skill-icons:electron

The Electron icon (skill-icons:electron) is a free SVG icon from the Skill Icons set by tandpfun. It is drawn on a 256 × 256 grid. Skill Icons are released under the MIT 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: Skill Icons
Author: tandpfun
License: MIT
Size: 256 × 256

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256"><g fill="none"><rect width="256" height="256" fill="#2b2e3a" rx="60"/><path fill="#9feaf9" d="M100.768 70.772c-26.005-4.736-46.567.221-54.762 14.415c-6.115 10.592-4.367 24.635 4.24 39.646a2.67 2.67 0 0 0 4.462.342a2.67 2.67 0 0 0 .519-2.002a2.7 2.7 0 0 0-.355-.993c-7.752-13.522-9.261-25.641-4.247-34.326c6.808-11.791 25.148-16.213 49.187-11.835a2.667 2.667 0 0 0 .956-5.247m-36.999 72.307c10.515 11.555 24.176 22.394 39.756 31.388c37.723 21.78 77.883 27.601 97.675 14.106a2.66 2.66 0 0 0 1.152-1.711a2.66 2.66 0 0 0-1.165-2.756a2.665 2.665 0 0 0-2.992.061c-17.714 12.078-55.862 6.548-92.003-14.318c-15.114-8.726-28.343-19.222-38.478-30.36a2.67 2.67 0 0 0-1.849-.876a2.664 2.664 0 0 0-2.795 2.543a2.67 2.67 0 0 0 .699 1.923"/><path fill="#9feaf9" d="M194.886 139.835c17.028-20.116 22.973-40.348 14.795-54.512c-6.017-10.423-18.738-15.926-35.645-16.146a2.666 2.666 0 0 0-1.92 4.514a2.67 2.67 0 0 0 1.851.819c15.205.198 26.165 4.939 31.096 13.48c6.792 11.765 1.49 29.807-14.248 48.399a2.66 2.66 0 0 0-.643 1.952c.027.352.124.694.285 1.008a2.65 2.65 0 0 0 1.568 1.328c.337.107.691.146 1.042.114a2.7 2.7 0 0 0 1.005-.296c.313-.164.589-.388.814-.66M151.125 71.66c-15.396 3.299-31.784 9.749-47.522 18.835c-38.942 22.483-64.345 55.636-60.817 79.675a2.66 2.66 0 0 0 1.038 1.775a2.66 2.66 0 0 0 2.98.155a2.66 2.66 0 0 0 1.217-1.657a2.7 2.7 0 0 0 .042-1.048c-3.133-21.344 20.947-52.769 58.207-74.281c15.267-8.815 31.135-15.06 45.972-18.239a2.67 2.67 0 0 0 1.674-4.14a2.68 2.68 0 0 0-1.74-1.106a2.7 2.7 0 0 0-1.051.031"/><path fill="#9feaf9" d="M88.036 186.835c8.904 24.86 23.469 40.167 39.847 40.167c11.945 0 22.996-8.143 31.614-22.478a2.67 2.67 0 0 0 .327-2.033a2.66 2.66 0 0 0-3.256-1.957a2.68 2.68 0 0 0-1.642 1.242c-7.745 12.883-17.258 19.892-27.043 19.892c-13.605 0-26.596-13.652-34.825-36.63a2.66 2.66 0 0 0-1.364-1.552a2.66 2.66 0 0 0-2.966.432a2.68 2.68 0 0 0-.864 1.877c-.012.355.047.709.173 1.04zm81.322-4.863c4.61-14.728 7.085-31.718 7.085-49.423c0-44.179-15.463-82.263-37.487-92.042a2.667 2.667 0 0 0-2.164 4.874c19.643 8.723 34.317 44.866 34.317 87.168c0 17.177-2.397 33.63-6.84 47.83a2.67 2.67 0 0 0 .816 2.874a2.675 2.675 0 0 0 2.971.313a2.67 2.67 0 0 0 1.303-1.594zm50.224-2.612c0-7.049-5.714-12.763-12.763-12.763s-12.763 5.714-12.763 12.763s5.714 12.763 12.763 12.763s12.763-5.714 12.763-12.763m-5.333 0c0 .976-.192 1.942-.566 2.843a7.42 7.42 0 0 1-4.021 4.022a7.432 7.432 0 0 1-10.273-6.865a7.432 7.432 0 0 1 12.684-5.254a7.43 7.43 0 0 1 2.176 5.254M48.763 192.123c7.05 0 12.764-5.714 12.764-12.763s-5.715-12.763-12.764-12.763S36 172.311 36 179.36s5.715 12.763 12.763 12.763m0-5.333a7.431 7.431 0 0 1-5.254-12.684a7.431 7.431 0 0 1 12.684 5.254a7.43 7.43 0 0 1-7.43 7.43"/><path fill="#9feaf9" d="M127.883 53.526c7.049 0 12.763-5.714 12.763-12.763S134.932 28 127.883 28s-12.763 5.714-12.763 12.763s5.714 12.763 12.763 12.763m0-5.333a7.43 7.43 0 1 1 0-14.861a7.43 7.43 0 0 1 0 14.861m1.949 93.382c-4.985 1.077-9.896-2.091-10.975-7.076a9.233 9.233 0 0 1 7.076-10.976c4.985-1.077 9.896 2.091 10.976 7.076c1.077 4.985-2.091 9.897-7.077 10.976"/></g></svg>

How to use the Electron icon

React

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

<Icon icon="skill-icons:electron" width="24" />

Vue

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

<template>
  <Icon icon="skill-icons:electron" width="24" />
</template>

Svelte

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

<Icon icon="skill-icons:electron" width="24" />

Tailwind CSS

<!-- @iconify/tailwind plugin -->
<span class="icon-[skill-icons--electron]"></span>

UnoCSS

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

Web component

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

<iconify-icon icon="skill-icons:electron"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/skill-icons/electron.svg" alt="Electron icon" width="24" height="24">

Electron icon in other icon sets

Electron icon FAQ

Is the Electron icon free for commercial use?

Yes. Skill Icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Electron icon in React?

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

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

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

Browse all Skill Icons →