Menu

AI SVG Studio
Sign in
Dark Mode SVG icon, line

Dark Mode SVG icon, line

A crescent moon and small four-point star indicate a night display setting. Place it in app settings menus or on display control panels.

Free ยท from Weather icons, line

Similar SVGs

More from Weather icons, line

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/vW8esDU2Hv6b/amnt.svg" alt="Dark Mode" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 15.5A8 8 0 0 1 8.5 5 8 8 0 1 0 19 15.5Z"/><path d="m18 2 .8 2.2L21 5l-2.2.8L18 8l-.8-2.2L15 5l2.2-.8L18 2Z"/></svg>
CSS background-image
.dark-mode {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/vW8esDU2Hv6b/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.dark-mode {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/vW8esDU2Hv6b/amnt.svg") center / contain no-repeat;
}
React
import DarkModeSvg from "./dark-mode.jsx"; // from the React tab above

<DarkModeSvg width={48} height={48} />

Tags

darknightmoondisplayweathericonline

Made with AMNT

AMNT SVG 1.1 drew this from the words Dark Mode: A crescent moon beside one small four-point star. as part of the pack Weather icons, line. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings