Orange icon

game-icons:orange

The Orange icon (game-icons:orange) is a free SVG icon from the Game Icons set by GameIcons. It is drawn on a 512 × 512 grid. Game Icons are released under the CC BY 3.0 license, which allows use in personal and commercial projects as long as you credit the author. Copy it as SVG, JSX, Vue or Svelte code, or download the SVG file.

Icon set: Game Icons
Author: GameIcons
License: CC-BY-3.0
Size: 512 × 512

Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512"><path fill="currentColor" d="M254.355 15.997c-93.512.726-182.057 56.405-220.066 148.166c-50.68 122.35 7.525 262.87 129.874 313.547c122.35 50.68 262.868-7.526 313.547-129.875S470.185 84.967 347.836 34.288c-30.587-12.67-62.31-18.532-93.48-18.29zm1.325 24.342c33.248 0 66.497 14.247 56.998 42.745L270.822 218.74L338.23 93.165c13.433-26.868 47.018-13.433 70.528 10.077s36.946 57.095 10.078 70.53l-126.7 66.57L428.91 199.43c3.562-1.188 6.903-1.71 10.02-1.644c21.82.455 32.728 29.547 32.728 58.64c0 33.247-14.25 66.497-42.748 56.997l-135.385-42.267l125.233 67.072c3.358 1.68 6.088 3.674 8.246 5.924c15.107 15.75 2.25 44.034-18.322 64.605c-23.51 23.51-57.095 36.947-70.53 10.078l-67.59-127.218a38.5 38.5 0 0 0 21.002-20.885c8.137-19.643-1.19-42.163-20.834-50.3c-19.642-8.136-42.162 1.192-50.298 20.835s1.19 42.162 20.834 50.3a38.5 38.5 0 0 0 29.127.126L311.93 428.91c19 56.998-132.993 56.998-113.994 0l43.605-137.63l-67.77 126.5c-26.867 53.736-134.343-53.74-80.606-80.61l124.156-66.243l-134.232 41.748c-53.435 17.812-56.775-114.662-10.02-115.637c3.117-.065 6.458.456 10.02 1.643l135.914 41.188L94.146 173.77C43.768 148.583 135.08 52.548 168.83 84.92c2.25 2.157 4.245 4.887 5.924 8.245L239.54 217.95L198.683 83.085c-9.5-28.498 23.75-42.746 56.998-42.746z"/></svg>

How to use the Orange icon

React

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

<Icon icon="game-icons:orange" width="24" />

Vue

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

<template>
  <Icon icon="game-icons:orange" width="24" />
</template>

Svelte

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

<Icon icon="game-icons:orange" width="24" />

Tailwind CSS

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

UnoCSS

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

Web component

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

<iconify-icon icon="game-icons:orange"></iconify-icon>

HTML image

<img src="https://iconyz.com/api/public/svg/game-icons/orange.svg" alt="Orange icon" width="24" height="24">

Related icons in Game Icons

Orange icon in other icon sets

Orange icon FAQ

Is the Orange icon free for commercial use?

Yes. Game Icons are released under the CC BY 3.0 license, which allows use in personal and commercial projects as long as you credit the author.

How do I use the Orange icon in React?

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

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

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

Browse all Game Icons →