Sunrise icon
vs:sunrise
The Sunrise icon (vs:sunrise) is a free SVG icon from the Vesper Icons set by TableCheck. It is drawn on a 1792 × 1472 grid. Vesper Icons are released under the Open Font 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
- Vesper Icons
- Author
- TableCheck
- License
- OFL-1.1
- Size
- 1792 × 1472
SVG code
<svg xmlns="http://www.w3.org/2000/svg" width="1792" height="1472" viewBox="0 0 1792 1472"><path fill="currentColor" d="M1565 1216h-93q0-157-77-289.5T1185.5 717T896 640t-289.5 77T397 926.5T320 1216h-93L47 968q-9-13-4-29q4-15 20-20l292-97V516q2-18 14-26q14-9 29-4l292 94l180-248q9-12 26-12t26 12l180 248l292-94q15-5 29 4q13 10 13 26v306l293 97q6 2 13 8t7 12q4 15-4 29l-181 248zM55 1312q-21 0-38 16.5T0 1367v50q0 22 17 38.5t38 16.5h1682q21 0 38-16.5t17-38.5v-50q0-22-17-38.5t-38-16.5zm841-576q-130 0-240.5 64.5t-175 175T416 1216h960q0-130-64.5-240.5t-175-175T896 736"/></svg>
How to use the Sunrise icon
React
import { Icon } from "@iconify/react";
<Icon icon="vs:sunrise" width="24" />
Vue
<script setup>
import { Icon } from "@iconify/vue";
</script>
<template>
<Icon icon="vs:sunrise" width="24" />
</template>
Svelte
<script>
import Icon from "@iconify/svelte";
</script>
<Icon icon="vs:sunrise" width="24" />
Tailwind CSS
<!-- @iconify/tailwind plugin -->
<span class="icon-[vs--sunrise]"></span>
UnoCSS
<!-- @unocss/preset-icons + @iconify-json/vs -->
<div class="i-vs:sunrise"></div>
Web component
<script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script>
<iconify-icon icon="vs:sunrise"></iconify-icon>
HTML image
<img src="https://iconyz.com/api/public/svg/vs/sunrise.svg" alt="Sunrise icon" width="24" height="24">
Related icons in Vesper Icons
Sunrise icon in other icon sets
Sunrise icon FAQ
Is the Sunrise icon free for commercial use?
Yes. Vesper Icons are released under the Open Font License, which allows use in personal and commercial projects.
How do I use the Sunrise icon in React?
Install @iconify/react and render <Icon icon="vs:sunrise" />, or use “Copy code” on this page to get a standalone React component.
How do I add the Sunrise icon to a web page?
Link the SVG file in an image tag: <img src="https://iconyz.com/api/public/svg/vs/sunrise.svg" alt="Sunrise icon">, or paste the SVG code inline to style it with CSS.
Browse all Vesper Icons →
ICONYZ
