Skip to content

Sunny Outline

The sunny-outline icon represents a clear and sunny day with plenty of sunshine, depicted in an outlined style.

Add shadcn.io to your AI agent. · Pro It installs Sunny Outline, or any of 294k icons, from a prompt, with Pro.

Set up MCP

Exports at 24 × 24 px

Sunny Outline icon from Material Symbols Light

Code

Sunny Outline in your framework

In any framework. Customize it above, and the code follows.

export const SunnyOutlineIcon = (props: React.SVGProps<SVGSVGElement>) => (
  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" {...props}>
    <path fill="currentColor" d="M11.5 5.423V2.039h1v3.384zm5.496 2.289l-.682-.683l2.357-2.452l.727.733zm1.581 4.788v-1h3.385v1zM11.5 21.962v-3.366h1v3.366zM7.042 7.68L4.577 5.329l.752-.708L7.73 7.004zm11.624 11.742l-2.352-2.452l.677-.657l2.388 2.346zM2.039 12.5v-1h3.384v1zm3.27 6.923l-.688-.752l2.358-2.357l.36.348l.378.354zM12.006 17q-2.082 0-3.544-1.457T7 12.005T8.457 8.46T11.995 7t3.544 1.457T17 11.995t-1.457 3.544T12.005 17M12 16q1.65 0 2.825-1.175T16 12t-1.175-2.825T12 8T9.175 9.175T8 12t1.175 2.825T12 16m0-4"/>
  </svg>
);

Other libraries

Sunny Outline in 8 more libraries

Each library draws it its own way. Open one to compare.

  • Sunny Outline icon from Material Symbols
  • Sunny Outline icon from IconPark Outline
  • Sunny Outline icon from IonIcons
  • Sunny Outline icon from TDesign Icons
  • Sunny Outline icon from Fluent UI MDL2
  • Sunny Outline icon from Famicons
  • Sunny Outline icon from Material Line Icons
  • Sunny Outline icon from Element Plus

Material Symbols Light

Icons that share its tags, in the same style.

  • Sunny Snowing Outline icon from Material Symbols Light
  • Dew Point Outline icon from Material Symbols Light
  • Partly Cloudy Day Outline icon from Material Symbols Light
  • Partly Cloudy Night Outline icon from Material Symbols Light
  • Storm Outline icon from Material Symbols Light
  • Weather Mix Outline icon from Material Symbols Light
  • Cloudy Snowing Outline icon from Material Symbols Light
  • Foggy Outline icon from Material Symbols Light
  • Lightning Stand Outline icon from Material Symbols Light
  • Nest Farsight Weather Outline icon from Material Symbols Light
  • Rainy Outline icon from Material Symbols Light
  • Weather Snowy Outline icon from Material Symbols Light
  • Cloud Circle Outline icon from Material Symbols Light
  • Cloud Outline icon from Material Symbols Light
  • Humidity High Outline icon from Material Symbols Light
  • Humidity Low Outline icon from Material Symbols Light
  • Cloud Done Outline icon from Material Symbols Light
  • Cloud Download Outline icon from Material Symbols Light
  • Humidity Mid Outline icon from Material Symbols Light
  • Humidity Percentage Outline icon from Material Symbols Light
  • Thermometer Alert Outline icon from Material Symbols Light
  • Thermometer Gain Outline icon from Material Symbols Light
  • Thunderstorm Outline icon from Material Symbols Light
  • Cloud Alert Outline icon from Material Symbols Light

Skip the copy and paste. With Pro, your AI agent finds and installs any Material Symbols Light icon from a prompt.

Get Pro

Tags

Browse by tag

Sunny Outline is tagged weather, forecast, meteorology and 1 more. Related tags follow; each opens its icons from every library.

Pricing

Material Symbols Light MCP, with Pro

Ask for Sunny Outline or any of 15,390 Material Symbols Light icons and your agent installs it. The MCP comes with every Pro plan, with 6,000+ blocks and 14 premium templates. The icons stay free.

4.9/5 out of 5 · 150+ reviewsfrom 150+ founders and developers.

Billed once a year in USD. Cancel anytime.

Individual

For personal projects & open source

$32instead of $49/mo

$389 billed yearly

  • How many people can use the license.Seats: 1 seat
  • Client work, SaaS products and anything you charge for.Commercial use: Personal & open source only
  • Production-ready React sections: hero, pricing, features, dashboards and more.Pro blocks: 6,000+ blocks
  • Complete multi-page sites you can ship as they are.Templates: All 14 templates
  • React icons from every major library, installable with one command.React icons: 294k+ icons
  • Presets that restyle every block, in light and dark.Themes: All 59 themes
  • Lets your AI editor search, preview and install blocks for you.MCP server: Basic usage
  • Priority requests are answered first.Support: Standard

Team

Most popular

For freelancers, agencies & startups

$66instead of $99/mo

$789 billed yearly · ≈ $13/dev/mo

Everything in Individual, plus

  • How many people can use the license.Seats: Up to 5 seats
  • Client work, SaaS products and anything you charge for.Commercial use: Included
  • Lets your AI editor search, preview and install blocks for you.MCP server: High usage
  • Priority requests are answered first.Support: Priority

Organization

For companies with larger teams

$132instead of $199/mo

$1,589 billed yearly

Everything in Team, plus

  • How many people can use the license.Seats: Unlimited seats
  • Lets your AI editor search, preview and install blocks for you.MCP server: Unlimited usage
  • Secure checkout via Stripe
  • Code lives in your repo
  • Keep what you've shipped if you cancel
  • License terms

FAQ

Frequently asked questions

What the Sunny Outline icon means and where it's used, then how to install, style and license it.

Install Sunny Outline from a prompt

MCP, 6,000+ blocks and 14 premium templates in every Pro plan. The icons stay free.

Get Pro