Home/Libraries/OpenMoji (Iconify)/sunrise

OpenMoji (Iconify)

Sunrise

License: CC-BY-SA-4.0

ICON SIZE

STROKE WEIGHT1.5px

COLOR PICKER

Download SVG without fill color (CSS-styleable)

<svg style="color: #818cf8" xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 72 72"><path fill="#61b2e4" d="M4 47.292h64v20.787H4z"/><path fill="#e27022" d="M4 4.079h64v43.213H4z"/><path fill="#f4aa41" d="M68 4.079h-8l-16 31l4 3l17-20l3-3.231M4 17.641l2.019 1.913L24.55 38.145l3.75-3.308L9 4.079H4zM30.879 4.079l2.469 28.375l4.983.412l3.749-25.98l.486-2.807M68 34.719l-21.932 6.999l.707 4.95L68 44.947M4 34.899l21.933 6.999l-.707 4.95L4 45.127"/><path fill="#fcea2b" d="M21.48 47.292a15.68 15.68 0 1 1 29.04 0"/><path fill="#fff" d="M67.964 24.049L68 47.292H49.932l5.087-10.284l3.622-3.575l1.002-5.65l1.284-2.879zm-63.927 0L4 47.292h17.48l-3.153-11.213l-3.479-3.988l.119-3.245l-3.894-3.942z"/><path fill="none" stroke="#818cf8" stroke-linecap="round" stroke-miterlimit="10" stroke-width="1.5" d="M8.48 32.188a7.753 7.753 0 0 1 9.848 4.82M5 24.026a7.753 7.753 0 0 1 9.848 4.82m39.627 11.737a7.753 7.753 0 0 1 8.332-7.127m-4.166-2.7a7.753 7.753 0 0 1 8.332-7.127M5.124 47.293h61.753m-46.387-3.33a15.68 15.68 0 1 1 30.775.253"/></svg>

Icons in Action

WEB APPLICATION HEADER & NAVIGATION

my-app.com/dashboard

Overview Dashboard

PROGRESS STEPPER

BUTTON UI ACTIONS

SCALABILITY & CLARITY

12px

16px

24px

32px

48px

“

Highly adaptable, clean vectors that scale perfectly across modern UI components, navigation bars, and mobile actions. Perfectly pre-vetted for production deployment.

IconSearch Presets

Frequently Asked Questions

Q.How do I use this icon in my React/Next.js project?

You have two choices: install the official package listed under the "REACT IMPORT" tab (e.g. npm install @iconify/react) and import the icon directly, or copy the complete React Component code from the "STANDALONE JSX" tab and paste it directly into a local file (e.g. SunriseIcon.tsx) to avoid installing any npm packages.

Q.Is this icon free for commercial use?

Yes. This icon is published under the open-source **CC-BY-SA-4.0** license. The license grants full permissions for personal and commercial usage (e.g., in SaaS platforms, client projects, or business landing pages). Attributing the icon creator is generally not required for MIT/ISC licenses, but check details on our dedicated License Guide.

Q.What is the "Download SVG without fill color" toggle?

Many SVGs ship with inline fill="..." attributes. By checking this toggle, we strip these attributes and enforce fill="none", making the SVG fully styleable via CSS classes or Tailwind utility classes like fill-current.