ICONYZ
English
Orange icon from Element Plus

Orange icon

ep:orange

The Orange icon (ep:orange) is a free SVG icon from the Element Plus set. It is drawn on a 1024 × 1024 grid. Element Plus 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
Element Plus
Author
Element Plus
License
MIT
Size
1024 × 1024
Download SVG

SVG code

<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024"><path fill="currentColor" d="M544 894.7a382 382 0 0 0 216-89.5l-183-183q-15.3 9.1-33 13.8zM805.2 760a382 382 0 0 0 89.5-216H636q-4.6 17.7-13.7 33zm89.5-280a382 382 0 0 0-89.5-216l-183 183q9.1 15.3 13.8 33zM759.9 218.8A382 382 0 0 0 544 129.3V388q17.7 4.6 33 13.7zM480 129.3a382 382 0 0 0-216 89.5l183 183q15.3-9.2 33-13.8zM218.8 264.1A382 382 0 0 0 129.3 480H388q4.6-17.7 13.7-33zM129.3 544a382 382 0 0 0 89.5 216l183-183a127 127 0 0 1-13.8-33zm134.8 261.2A382 382 0 0 0 480 894.7V636a127 127 0 0 1-33-13.7zM512 960a448 448 0 1 1 0-896a448 448 0 0 1 0 896m0-384a64 64 0 1 0 0-128a64 64 0 0 0 0 128"/></svg>

How to use the Orange icon

React

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

<Icon icon="ep:orange" width="24" />

Vue

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

<template>
  <Icon icon="ep:orange" width="24" />
</template>

Svelte

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

<Icon icon="ep:orange" width="24" />

Tailwind CSS

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

UnoCSS

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

Web component

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

<iconify-icon icon="ep:orange"></iconify-icon>

HTML image

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

Orange icon in other icon sets

Orange icon FAQ

Is the Orange icon free for commercial use?

Yes. Element Plus icons are released under the MIT license, which allows use in personal and commercial projects.

How do I use the Orange icon in React?

Install @iconify/react and render <Icon icon="ep: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/ep/orange.svg" alt="Orange icon">, or paste the SVG code inline to style it with CSS.

Browse all Element Plus icons →